Customizing the Accordion effect
Adding a custom effect If you want to make custom effects, you'll use the $.tools.tabs.addEffect() method. The first argument is the effect name and the second argument is the function that performs the…
Simple jQuery Alternate Plugin
I recently required a light-weight unobtrusive javascript to set alternating styles on <table> rows and other elements (such as <li>s or <div>s). There are some options available, but…
Interactive Picture with jQuery(Image Tips)
In this tutorial I will be showing you how to piece together an interactive picture – aka an image that contains tooltips and popup boxes. This can be useful for showing off a particular aspect…
HTML5 Demo: Drag and drop
Drag the list items over the dustbin, and drop them to have the bin eat the item
Reorder and filter items with a nice shuffling animation(Quicksand)
How it works At the very basic level, Quicksand replaces one collection of items with another. All you need to do is provide those two sets of items. You can do it in a couple of ways: Use plain HTML,…
Images Or Banner Rotator With jQuery
How To Use It? Step 1 – XHTML The XHTML code of the banners is generated on the fly by PHP after a database query, and outputted to the page. Here is how the markup for a sample banner looks like:…
Phatfusion multiBox lightbox
lightbox that supports jpg, gif, png, flash, flv, mov, wmv, mp3, html, iframe features supports a range of multimedia formats. auto detects format or you can specify the format. supports html descriptions.…
PiroBox lightbox with jQuery
The gallery is simple to set up, and offers some great features: Built completely on the jQuery library Automatically resizes images based on browser window size Previous/Next links can be outside the…
Fancy Hover Effect with jQuery
Very cool hover effect HTML <div id="featured-wrap"> <div id="featured-content"> <a href="http://www.jardinesdelte.com/"><img alt="Jardines" src="2_s.jpg" /></a> <a…
Simple Image Gallery Navigation (slider) plugin in jQuery
How to setup You must include in your page’s HEAD section the jQuery library and the slider plugin : Add JavaScript Files: <script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>…
Making Accordions with the Tabs(jquery)
HTML coding Our HTML layout is a bit different than in tabs. The accordion headers are positioned in front of the panes and everything is contained as a flat list inside a single root DIV element with…
Making a Mosaic Slideshow With jQuery & CSS
We are making a jQuery & CSS mosaic gallery. Mosaic, because it will feature an interesting tile transition effect when moving from one slide to another. Step 1 – XHTML The mosaic…
Slideshow Feature List
Using Feature List requires a simple function call: $.featureList( $("#tabs li a"), $("#output li"), { start_item : 1 } ); // Alternative $('#tabs li a').featureList({ output : '#output li', start_item…
Sliding Boxes and Captions with jQuery
Learn how to use JQuery animations to slide captions and images in and out of view. Don’t distract your visitors, show them only what they need to see. Come check out what you can do to juice up…
Tags
accordion accordion menu animation navigation animation navigation menu carousel checkbox inputs css3 css3 menu css3 navigation date picker dialog drag drop drop down menu drop down navigation menu elastic navigation form form validation gallery glide navigation horizontal navigation menu hover effect image gallery image hover image lightbox image scroller image slideshow multi-level navigation menus rating select dependent select list slide image slider menu stylish form table tabs text effect text scroller tooltips tree menu vertical navigation menu