background preloader

JqDock : a jQuery plugin

JqDock : a jQuery plugin

Side Content Example Side Content Summary The jQuery Side Content project is a plugin that docks content to the side of the browser window with "pull out" handles to open and close the panels. You can add multiple side-content tabs to the side of your page and the plugin will automatically toggle them when the visitor clicks on the "pull out". Side Content This is the side content that you want to de-clutter from your page. You can apply whatever CSS rules you like to this element, only the position and behaviour will be changed by the plugin. There are plenty of configurable settings if you want to change the default behaviour! More Content This is a different panel Another One Options classmodifier Used to apply class names to the elements created by the plugin. attachto You can opt to dock the side content panels on the "leftside" or "rightside" of the browser. width The width of the panel when it is activated, for example "300px" or "33%". opacity pulloutpadding textdirection clickawayclose

tabSlideOut jQuery plugin example page See that little tab over there that says 'Contact'? If you click that it will slide out. This plugin allows you to easily add one of those to your page. The most important part of getting this plugin to work is to have your image path and image dimensions set correctly in the options. In this version, using the code below, I am linking directly to google code for the jquery library as well as the plugin which I am hosting at code.google.com. In your <head> tag you need the javascript (with the options customized for your image): Below that add your css: Anywhere in your page, (I put mine right above my </body>) put in the html for your hidden content. <div class="slide-out-div"><a class="handle" href=" me</h3><p>Thanks for checking out my jQuery plugin, I hope you find this useful.

UI.Layout Plug-in - Downloads UI Layout Download Sample Pages These simple demos are self-contained - right-click to download: SEE MORE demos & samples on our demos page. Layout 1.3.x Custom Callbacks I have compiled some commonly requested custom layout-callback functions into plugin-style add-ons for Layout. $.layout.callbacks.pseudoClose NOTE: Also see the slideOffscreen plug-in below. The pseudoClose callback prevents the normal 'close' functionality of a pane and replaces it with a 'resize' command that makes the pane just 1px in size. The new pseudoClose 1.1 feature requires Layout RC30.4 or higher. $.layout.callbacks.slideOffscreen – Animation (replaces pseudoClose) I created a custom open/close animation that works just like the default 'slide' animation, except that instead of 'hiding' the pane after closing, it is just moved off-screen. This is actually not a "callback" - it is a "Layout plug-in". $.layout.callbacks.resizeTabLayout $.layout.callbacks.resizePaneAccordions $.layout.callbacks.resizeDataTable Change-Log

Using jsTree to get a Treeview with checkboxes in ASP.NET MVC « Matt's work blog UPDATE 17 December 2011! After one year this is still the most popular post on my blog. However, this uses jsTree v0.9.9a2 and jsTree is now in version v1.0 which has changed completely. This post does not work with jsTree v1.0!!! I have written a post using the latest version of jsTree here jsTree is a jQuery plugin for creating a treeviews, and jsTree’s checkbox plugin allows you to create a treeview with tri-state checkboxes, like so: Notice how “Origination” appears half-checked because only some of its children are checked. Getting started For this demo I am using ASP.NET MVC 2 and jsTree v0.9.9a2. In the View, create a div which you want to become a treeview. Views/Home/Index.aspx Next, create index.js, add a reference to it in Index.aspx, and add the following code: Scripts/index.js This should create a basic treeview with checkboxes, with static data. Populating the tree with an AJAX request Models/JsTreeModel.cs In Controllers/HomeController.cs add the following function: and the View

jQuery selectors and attribute selectors reference and examples | Pamaya - Web Design & Development North Wales - Software Development, Graphic Design and Branding jQuery selectors and attribute selectors reference and examples Tuesday, March 31st, 2009 at 11:44 pm by Maja Williams jQuery selectors and attribute selectors are some of the best features jQuery has to offer when it comes to DOM manipulation. They allow you to quickly select all elements or groups of element of a given tag name, attribute name or their contents and allow you to manipulate them as a group or a single node. This article can be used as a beginners guide to selectors or as a cheahsheet or reference The following table lists the different methods you have available to you to select nodes when using jQuery. (function ($) { })(jQuery); (function ($) { //Your code here })(jQuery); jQuery selectors and examples Hopefully this reference table will help you on your way with jQuery selectors and attribute selector. For information on how to use the returned jQuery object from any of the selectors above please read this aticle: jQuery Object to jQuery DOM Element

jsTree » Home jQuery: The Write Less, Do More, JavaScript Library 41 Remarkable and useful jQuery Plugins jQuery is one of the most popular Javascript framework out there. It is very easy to use and full of cool features. It can be hard for us to know how to use the code and create amazing stuff using jQuery. So, developers decided to release and create plugins to help us fulfill this task by making it easier for us. I have collected a list of 41 very remarkable jQuery plugins, that will help you use jQuery in a robust way. Here’s that awesome list of the best jQuery plugins that will help you add beautiful effects and functionality in your next project. Nivo Slider Nivo Slider is a subtle jquery plugin for making very beautiful image sliders. jQuery Quicksand jQuery plugin for reordering and filtering items with a nice shuffling animation. Pages: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 This entry was posted on Wednesday, July 28th, 2010 at 21:55 and is filed under Resources. I am just a web design fanatic. About the author Published by Swat Chap Trackbacks

Related: