<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Learning jQuery &#187; jQuery Plugins</title>
	<atom:link href="http://www.learningjquery.org/index.php/tag/jquery-plugins/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.learningjquery.org</link>
	<description>Learning jQuery: Tips, techniques, and tutorials for the jQuery JavaScript library</description>
	<lastBuildDate>Tue, 24 Aug 2010 10:10:35 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.1</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>50 Best jQuery plugins</title>
		<link>http://www.learningjquery.org/index.php/50-best-jquery-plugins/</link>
		<comments>http://www.learningjquery.org/index.php/50-best-jquery-plugins/#comments</comments>
		<pubDate>Fri, 24 Jul 2009 08:38:17 +0000</pubDate>
		<dc:creator>Ben</dc:creator>
				<category><![CDATA[jQuery]]></category>
		<category><![CDATA[jQuery Plugins]]></category>

		<guid isPermaLink="false">http://www.learningjquery.org/?p=64</guid>
		<description><![CDATA[
Article 50 Best jQuery plugins &#8211; June 2009

Mon, 2009-07-20 18:54   &#124; 3 comments

.b-news-content h3 { color:#006699; font-size:12px; font-weight:bold; margin-bottom:0; margin-top:25px; }



&#60;!--
google_ad_client = "pub-0930152984324688";
google_ad_width = 336;
google_ad_height = 280;
google_ad_format = "336x280_as";
google_ad_type = "text_image";
google_ad_channel = "";
google_color_border = "FFFFFF";
google_color_bg = "FFFFFF";
google_color_link = "027AC6";
google_color_text = "494949";
google_color_url = "027AC6";
//--&#62; 
google_protectAndRun("ads_core.google_render_ad", google_handleError, google_render_ad);




jqDock
Transform a set of images into a Mac-like [...]]]></description>
			<content:encoded><![CDATA[<div class="picture"></div>
<h2><a rel="nofollow" href="http://www.ajaxline.com/articles">Article</a><img style="margin: 2px -4px -7px 4px;" src="http://www.ajaxline.com/images/news-arrow.png" alt="" /> <span id="b-cat"><a title="50 Best jQuery plugins - June 2009" rel="nofollow" href="http://www.ajaxline.com/best-jquery-plugins-june-2009">50 Best jQuery plugins &#8211; June 2009</a></span></h2>
<div class="b-news-subheader">
<div class="submitted subheader b-news-date">Mon, 2009-07-20 18:54   <span class="b-news-subheader-separator">|</span> <span class="b-news-comments">3 comments</span></div>
</div>
<div class="b-news-content">.b-news-content h3 { color:#006699; font-size:12px; font-weight:bold; margin-bottom:0; margin-top:25px; }</p>
<table style="border-collapse: separate;" border="0">
<tbody>
<tr>
<td><script type="text/javascript">&lt;!--
google_ad_client = "pub-0930152984324688";
google_ad_width = 336;
google_ad_height = 280;
google_ad_format = "336x280_as";
google_ad_type = "text_image";
google_ad_channel = "";
google_color_border = "FFFFFF";
google_color_bg = "FFFFFF";
google_color_link = "027AC6";
google_color_text = "494949";
google_color_url = "027AC6";
//--&gt;</script> <script src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript">
</script><script src="http://pagead2.googlesyndication.com/pagead/expansion_embed.js"></script><script src="http://googleads.g.doubleclick.net/pagead/test_domain.js"></script><script>google_protectAndRun("ads_core.google_render_ad", google_handleError, google_render_ad);</script><ins style="border: medium none; margin: 0pt; padding: 0pt; display: inline-table; height: 280px; position: relative; visibility: visible; width: 336px;"><ins style="border: medium none; margin: 0pt; padding: 0pt; display: block; height: 280px; position: relative; visibility: visible; width: 336px;"></ins></ins></td>
<td></td>
</tr>
</tbody>
</table>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/jqDock">jqDock</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/jqDock"><img src="http://www.ajaxline.com/files/jqdock.png" alt="" /></a>Transform a set of images into a Mac-like Dock menu, horizontal or vertical, with icons that expand on rollover, and optional labels.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/NotesForMenu">NotesForMenu</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/NotesForMenu"><img src="http://www.ajaxline.com/files/notesfm.png" alt="" /></a>NotesForMenu is a very simple JQuery plugin to create a multi-level menu with only one line of code. You can also very easily customize it.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/jquery_drop_line_menu">jQuery DropLine Menu</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/jquery_drop_line_menu"><img src="http://www.ajaxline.com/files/droplmenu.png" alt="" /></a>This jQuery menu turns a nested UL list into a horizontal drop line menu, with each sub menu appearing as a single row of links beneath its parent menu.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/navigmenu">NavigMenu</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/navigmenu"><img src="http://www.ajaxline.com/files/navigmenu.png" alt="" /></a>A menu to site navigating. It shows on double click anywhere in document or in a container/layer.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/jquerymegamenu">MegaMenu</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/jquerymegamenu"><img src="http://www.ajaxline.com/files/megamenu.png" alt="" /></a>Mega Menus refer to drop down menus that contain multiple columns of links. This jQuery script lets you add a mega menu to any anchor link on your page, with each menu revealed using a sleek expanding animation. Customize the animation duration plus delay before menu disappears when the mouse rolls out of the anchor.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/listnav">ListNav</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/listnav"><img src="http://www.ajaxline.com/files/listnav.png" alt="" /></a>Supplies an easy way to unobtrusively add a letter-based navigation widget to any UL or OL list. An easily stylable (via CSS) nav bar appears above the list, showing the user the letters A-through-Z. Clicking one of the letters filters the list to show only the items in the list that start with that letter. Hovering over a letter (optionally) shows a count above the letter, indicating how many items will be displayed if that letter is clicked. Other options give you control over the functionality.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/svg">jQuery SVG</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/svg"><img src="http://www.ajaxline.com/files/jqsvg.png" alt="" /></a>A jQuery plugin that lets you interact with an SVG canvas.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/superbox">SuperBox!</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/superbox"><img src="http://www.ajaxline.com/files/jqsuperbox.png" alt="" /></a>jQuery Superbox! is an accessible, highly extensible and customisable &#8220;Lightbox&#8221; clone.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/stepcarouselviewer">Step Carousel Viewer</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/stepcarouselviewer"><img src="http://www.ajaxline.com/files/stepcar.png" alt="" /></a>Step Carousel Viewer displays images or even rich HTML by side scrolling them left or right. Users can step to any specific content on demand, or browse the gallery sequentially by stepping through x number of contents each time. A smooth sliding animation is used to transition between steps. The contents for the Step Carousel Viewer can be defined either directly inline on the page, or via Ajax and extracted from an external file instead. In both cases, the contents are simply DIVs with a shared CSS class name that wrap around each individual content.</p>
<h3><a rel="nofollow" href="http://www.coswest.com/c/jquery/carousel3d/">3D Carousel</a></h3>
<p><a rel="nofollow" href="http://www.coswest.com/c/jquery/carousel3d/"><img src="http://www.ajaxline.com/files/3dcaro.png" alt="" /></a>3D Carousel creates a mini-interactive page that can be a fun addition to a site.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/ad-gallery">Ad Gallery</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/ad-gallery"><img src="http://www.ajaxline.com/files/adgall.png" alt="" /></a>An image gallery plugin with a list of thumbnails below the image. Not quite like Lightbox or Thickbox, but more of a showcase type of gallery.</p>
<h3><a rel="nofollow" href="http://pupunzi.wordpress.com/2009/01/20/mbimgnavigator/"> (mb)ImgNavigator 2.0</a></h3>
<p><a rel="nofollow" href="http://pupunzi.wordpress.com/2009/01/20/mbimgnavigator/"><img src="http://www.ajaxline.com/files/imgnav.jpg" alt="" /></a>A photogallery for extralarg images with navigator. You can drag your extralarge image in the display by the navigator or the image itself.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/jquery-watermark">Watermark</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/jquery-watermark"><img src="http://www.ajaxline.com/files/sample-watermark.png" alt="" /></a>This simple-to-use jQuery plugin adds watermark capability to the INPUT and TEXTAREA  HTML elements.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/inputlimiter">Input Limiter</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/inputlimiter"><img src="http://www.ajaxline.com/files/jqinputlim.png" alt="" /></a>This jQuery plugin will allow you to limit input into form fields. It can display a message as the user types to let them know how many characters they have remaining.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/sharethis">ShareThis</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/sharethis"><img src="http://www.ajaxline.com/files/jqshareit.png" alt="" /></a>Provides a button to the ShareThis web service for easily sharing information.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/opensocial-jquery">opensocial-jQuery</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/opensocial-jquery"><img src="http://www.ajaxline.com/files/jqopensoc.jpg" alt="" /></a>&#8220;opensocial-jquery&#8221; is jQuery based concise JavaScript Library for rapid OpenSocial Gadgets development. When you use &#8220;opensocial-jquery&#8221;, you can develop OpenSocial Gadgets by the method of developing the website by jQuery.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/ClockPick">ClockPick</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/ClockPick"><img src="http://www.ajaxline.com/files/clockpick.png" alt="" /></a>ClockPick is a timepicker plugin, enabling users to enter a time value into a form field. Using a unique popup div UI, ClockPick gets the job done in about 1/5 the time it takes to enter a time value using a traditional select menu UI.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/DivCorners">DivCorners</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/DivCorners"><img src="http://www.ajaxline.com/files/divcorn.png" alt="" /></a>This plugin aims to created an easy way to add border layouts to screen content. It includes three functions that can be called after jquery.pack.js and jquery.divcorners.js are loaded.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/FavoriteIcon">Favorite Icon</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/FavoriteIcon"><img src="http://www.ajaxline.com/files/favicon.png" alt="" /></a>This plugin intended for adding favicons to external links.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/activebar2">Activebar2</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/activebar2"><img src="http://www.ajaxline.com/files/activebar2.png" alt="" /></a>Activebar2 is a crossbrowser information bar mimicking the look and feel of the widely spread bars used in modern browsers. It provides an easy and unobtrusive way of communicating all sorts of messages to your users. Or to provide help by displaying tips and usage informations.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/jBreadCrumb">jBreadCrumb</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/jBreadCrumb"><img src="http://www.ajaxline.com/files/jbc.png" alt="" /></a>Plugin for creating animated breadcrumbs with jQuery.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/jContext">jContext</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/jContext"><img src="http://www.ajaxline.com/files/jqcontmen.png" alt="" /></a>This plugin implements simple lightweight menu.</p>
<h3><a rel="nofollow" href="http://www.gimiti.com/kltan/wordpress/?p=40">jSuggest</a></h3>
<p><a rel="nofollow" href="http://www.gimiti.com/kltan/wordpress/?p=40"><img src="http://www.ajaxline.com/files/jsugg.gif" alt="" /></a>Suggest is yet another auto-completer for your text input box. It mimics the functionality of Google suggest. jSuggest will also bind item selection to your up and down arrows and also allow you to select the suggestions using your mouse.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/jGesture">jGesture</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/jGesture"><img src="http://www.ajaxline.com/files/jgest.png" alt="" /></a>A cross browser jQuery plugin for detecting mouse gestures. Enable your application with the standard gestures or create your own.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/Lettrine">Effect Letterine</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/Lettrine"><img src="http://www.ajaxline.com/files/letterine.png" alt="" /></a>This plugin enables an effect &#8220;Lettrine&#8221;, each first letter of paragrah is replace by a corresponding image of the letter.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/dynacloud">DynaCloud</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/dynacloud"><img src="http://www.ajaxline.com/files/dynacloud.png" alt="" /></a>DynaCloud is a jQuery plugin that generates tag or keyword clouds from text on web pages and highlights matching parts once a keyword is clicked.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/DropShadow">Drop Shadow</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/DropShadow"><img src="http://www.ajaxline.com/files/dshadow.png" alt="" /></a>This plugin creates soft drop shadows behind page elements, including text and transparent images. It accepts options for the horizontal and vertical offsets, amount of blur, opacity, and color.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/formwizard">Form Wizard Plugin</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/formwizard"><img src="http://www.ajaxline.com/files/fwiz.png" alt="" /></a>The form wizard plugin is a plugin based on jQuery which can be used to simulate wizard like page flows for forms without having to navigate between different pages.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/Pager">jQuery Pager</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/Pager"><img src="http://www.ajaxline.com/files/jqpager.png" alt="" /></a>A simple JQuery plugin to provide paging UI functionality for data driven web applications</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/jgcharts">jQuery Google Charts</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/jgcharts"><img src="http://www.ajaxline.com/files/jcharts.png" alt="" /></a>This plugin providen an useful wrapper for Google API Chart</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/jqPuzzle">jqPuzzle</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/jqPuzzle"><img src="http://www.ajaxline.com/files/jqpuzzle.png" alt="" /></a>jqPuzzle lets you easily create sliding puzzles for your web page. Select an image, put it in your page, and add some magic – jqPuzzle will automatically turn it into a full-blown sliding puzzle. If you want, you can highly customize (number of rows/cols, hole position, initial appearance, controls, animation speeds) and style your sliding puzzle according to your needs. The interface is available in several languages, and you can add your own texts on the fly.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/wayfarer-tooltip">Way Farer Tooltip</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/wayfarer-tooltip"><img src="http://www.ajaxline.com/files/wayftt.png" alt="" /></a>The &#8220;wTooltip&#8221; is a lightweight, flexible tooltip that is made to be easily customized. The default behavior is the conversion of the title attribute into the tooltip, which makes quick creation of multiple tooltips on any page a snap.</p>
<h3><a rel="nofollow" href="http://www.gimiti.com/kltan/wordpress/?p=37">jHelperTip</a></h3>
<p><a rel="nofollow" href="http://www.gimiti.com/kltan/wordpress/?p=37"><img src="http://www.ajaxline.com/files/jhtip.png" alt="" /></a>jHelperTip is intended to be useful in many situations such as hovering tip and clickable tips. It can get data from a container, through Ajax or even the attributes of the current object.</p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/jmaps">JMaps Frameworks</a></h3>
<p>The JMaps Framework is a jQuery plugin that provides a simple but powerful API for Google&#8217;s mapping services.</p>
<div class="dp-highlighter">
<div class="bar">
<div class="tools"><a onclick="dp.sh.Toolbar.Command('ViewSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">view plain</a><a onclick="dp.sh.Toolbar.Command('CopyToClipboard',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">copy to clipboard</a><a onclick="dp.sh.Toolbar.Command('PrintSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">print</a><a onclick="dp.sh.Toolbar.Command('About',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">?</a></div>
</div>
<ol class="dp-c">
<li class="alt"><span><span>jQuery(document).ready(</span><span class="keyword">function</span><span>(){ </span></span></li>
<li><span> jQuery(<span class="string">&#8216;#map1&#8242;</span><span>).jmap(</span><span class="string">&#8216;init&#8217;</span><span>, {</span><span class="string">&#8216;mapType&#8217;</span><span>:</span><span class="string">&#8216;hybrid&#8217;</span><span>,</span><span class="string">&#8216;mapCenter&#8217;</span><span>:[40.736216,-74.193393]}); </span></span></li>
<li class="alt"><span> </span></li>
<li><span> jQuery(<span class="string">&#8216;.toggle-map&#8217;</span><span>).toggle(</span><span class="keyword">function</span><span>(){ </span></span></li>
<li class="alt"><span> jQuery(<span class="string">&#8216;#map1&#8242;</span><span>).fadeOut(</span><span class="keyword">function</span><span>(){ </span></span></li>
<li><span> jQuery(<span class="keyword">this</span><span>).jmap(</span><span class="string">&#8216;CheckResize&#8217;</span><span>); </span></span></li>
<li class="alt"><span> }); </span></li>
<li><span> }, <span class="keyword">function</span><span>(){ </span></span></li>
<li class="alt"><span> jQuery(<span class="string">&#8216;#map1&#8242;</span><span>).fadeIn(</span><span class="keyword">function</span><span>(){ </span></span></li>
<li><span> jQuery(<span class="keyword">this</span><span>).jmap(</span><span class="string">&#8216;CheckResize&#8217;</span><span>); </span></span></li>
<li class="alt"><span> }); </span></li>
<li><span> }); </span></li>
<li class="alt"><span> </span></li>
<li><span> jQuery(<span class="string">&#8216;.resize&#8217;</span><span>).click(</span><span class="keyword">function</span><span>(){ </span></span></li>
<li class="alt"><span> <span class="keyword">var</span><span> size = jQuery(</span><span class="keyword">this</span><span>).attr(</span><span class="string">&#8216;rel&#8217;</span><span>) + </span><span class="string">&#8216;px&#8217;</span><span>; </span></span></li>
<li><span> jQuery(<span class="string">&#8216;#map1&#8242;</span><span>).animate({</span><span class="string">&#8216;width&#8217;</span><span>: size, </span><span class="string">&#8216;height&#8217;</span><span>: size}, </span><span class="keyword">function</span><span>(){ </span></span></li>
<li class="alt"><span> jQuery(<span class="keyword">this</span><span>).jmap(</span><span class="string">&#8216;CheckResize&#8217;</span><span>); </span></span></li>
<li><span> }); </span></li>
<li class="alt"><span> }); </span></li>
<li><span>}); </span></li>
<li class="alt"><span> </span></li>
</ol>
</div>
<p><textarea class="js" style="display: none;" cols="60" rows="30" name="code">jQuery(document).ready(function(){ 	jQuery(&#8216;#map1&#8242;).jmap(&#8216;init&#8217;, {&#8216;mapType&#8217;:'hybrid&#8217;,'mapCenter&#8217;:[40.736216,-74.193393]}); 	 	jQuery(&#8216;.toggle-map&#8217;).toggle(function(){ 		jQuery(&#8216;#map1&#8242;).fadeOut(function(){ 			jQuery(this).jmap(&#8216;CheckResize&#8217;); 		}); 	}, function(){ 		jQuery(&#8216;#map1&#8242;).fadeIn(function(){ 			jQuery(this).jmap(&#8216;CheckResize&#8217;); 		}); 	}); 	 	jQuery(&#8216;.resize&#8217;).click(function(){ 		var size = jQuery(this).attr(&#8216;rel&#8217;) + &#8216;px&#8217;; 		jQuery(&#8216;#map1&#8242;).animate({&#8216;width&#8217;: size, &#8216;height&#8217;: size}, function(){ 			jQuery(this).jmap(&#8216;CheckResize&#8217;); 		}); 	}); }); </textarea></p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/mousewheel">Mouse  Wheel extension</a></h3>
<p>This plugin adds mouse wheel support for your application. Just call mousewheel to add the event and call unmousewheel to remove the event.</p>
<div class="dp-highlighter">
<div class="bar">
<div class="tools"><a onclick="dp.sh.Toolbar.Command('ViewSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">view plain</a><a onclick="dp.sh.Toolbar.Command('CopyToClipboard',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">copy to clipboard</a><a onclick="dp.sh.Toolbar.Command('PrintSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">print</a><a onclick="dp.sh.Toolbar.Command('About',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">?</a></div>
</div>
<ol class="dp-c">
<li class="alt"><span><span>$(</span><span class="string">&#8216;div.mousewheel_example&#8217;</span><span>).mousewheel(fn); </span></span></li>
<li><span>$(<span class="string">&#8216;div.mousewheel_example&#8217;</span><span>).bind(</span><span class="string">&#8216;mousewheel&#8217;</span><span>, fn); </span></span></li>
</ol>
</div>
<p><textarea class="js" style="display: none;" cols="60" rows="30" name="code">$(&#8216;div.mousewheel_example&#8217;).mousewheel(fn); $(&#8216;div.mousewheel_example&#8217;).bind(&#8216;mousewheel&#8217;, fn); </textarea></p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/BigPicture">jQuery BigPicture</a></h3>
<p>jQuery BigPicture is an unobtrusive plugin designed to display images in a modal window along with a full description.</p>
<div class="dp-highlighter">
<div class="bar">
<div class="tools"><a onclick="dp.sh.Toolbar.Command('ViewSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">view plain</a><a onclick="dp.sh.Toolbar.Command('CopyToClipboard',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">copy to clipboard</a><a onclick="dp.sh.Toolbar.Command('PrintSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">print</a><a onclick="dp.sh.Toolbar.Command('About',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">?</a></div>
</div>
<ol class="dp-c">
<li class="alt"><span><span>$(</span><span class="string">&#8216;#basic&#8217;</span><span>).bigPicture(); </span></span></li>
</ol>
</div>
<p><textarea class="js" style="display: none;" cols="60" rows="30" name="code">$(&#8216;#basic&#8217;).bigPicture(); </textarea></p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/priceformat">Price Format Plugin</a></h3>
<p>jQuery Price Format Plugin is a plugin to format input text fields as prices. For example, if you type 123456, the plugin updates it to US$ 1,234.56. It is costumizable, so you can use other prefixes and separators (for example, use it to get R$ 1.234,55), and also limit the the number of chars or change the size of the cents field (for example, to get US$ 12.345)</p>
<div class="dp-highlighter">
<div class="bar">
<div class="tools"><a onclick="dp.sh.Toolbar.Command('ViewSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">view plain</a><a onclick="dp.sh.Toolbar.Command('CopyToClipboard',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">copy to clipboard</a><a onclick="dp.sh.Toolbar.Command('PrintSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">print</a><a onclick="dp.sh.Toolbar.Command('About',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">?</a></div>
</div>
<ol class="dp-c">
<li class="alt"><span><span>$(</span><span class="string">&#8216;#example2&#8242;</span><span>).priceFormat({ </span></span></li>
<li><span> prefix: <span class="string">&#8216;R$ &#8217;</span><span>, </span></span></li>
<li class="alt"><span> centsSeparator: <span class="string">&#8216;,&#8217;</span><span>, </span></span></li>
<li><span> thousandsSeparator: <span class="string">&#8216;.&#8217;</span><span> </span></span></li>
<li class="alt"><span>}); </span></li>
</ol>
</div>
<p><textarea class="js" style="display: none;" cols="60" rows="30" name="code">$(&#8216;#example2&#8242;).priceFormat({     prefix: &#8216;R$ &#8216;,     centsSeparator: &#8216;,&#8217;,     thousandsSeparator: &#8216;.&#8217; }); </textarea></p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/repeatedclick">Repeated Clicks</a></h3>
<p>Repeats events if user hold mouse button.</p>
<div class="dp-highlighter">
<div class="bar">
<div class="tools"><a onclick="dp.sh.Toolbar.Command('ViewSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">view plain</a><a onclick="dp.sh.Toolbar.Command('CopyToClipboard',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">copy to clipboard</a><a onclick="dp.sh.Toolbar.Command('PrintSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">print</a><a onclick="dp.sh.Toolbar.Command('About',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">?</a></div>
</div>
<ol class="dp-c">
<li class="alt"><span><span>$(</span><span class="string">&#8216;.counter .plus&#8217;</span><span>).repeatedclick(</span><span class="keyword">function</span><span> () { </span></span></li>
<li><span> <span class="comment">// body&#8230;</span><span> </span></span></li>
<li class="alt"><span>}, { </span></li>
<li><span> duration  : 500, <span class="comment">// starting duration</span><span> </span></span></li>
<li class="alt"><span> speed     : 0.8, <span class="comment">// duration multiplier</span><span> </span></span></li>
<li><span> min       : 100  <span class="comment">// minimum duration</span><span> </span></span></li>
<li class="alt"><span>}) </span></li>
</ol>
</div>
<p><textarea class="js" style="display: none;" cols="60" rows="30" name="code">$(&#8216;.counter .plus&#8217;).repeatedclick(function () {   // body&#8230; }, {   duration  : 500, // starting duration   speed     : 0.8, // duration multiplier   min       : 100  // minimum duration }) </textarea></p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/checkgroup">CheckBoxGroup</a></h3>
<p>This useful little plugin provides &#8220;select all&#8221; checkbox functionality to a group of checkboxes. The select all checkbox stays in sync with the group so it is appropriately checked when it needs to be.</p>
<div class="dp-highlighter">
<div class="bar">
<div class="tools"><a onclick="dp.sh.Toolbar.Command('ViewSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">view plain</a><a onclick="dp.sh.Toolbar.Command('CopyToClipboard',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">copy to clipboard</a><a onclick="dp.sh.Toolbar.Command('PrintSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">print</a><a onclick="dp.sh.Toolbar.Command('About',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">?</a></div>
</div>
<ol class="dp-xml">
<li class="alt"><span><span class="tag">&lt;</span><span class="tag-name">input</span><span> </span><span class="attribute">type</span><span>=</span><span class="attribute-value">&#8216;checkbox&#8217;</span><span> </span><span class="attribute">class</span><span>=</span><span class="attribute-value">&#8216;checkall&#8217;</span><span class="tag">&gt;</span><span>checkall</span><span class="tag">&lt;</span><span class="tag-name">br</span><span class="tag">&gt;</span><span> </span></span></li>
<li><span><span class="tag">&lt;</span><span class="tag-name">input</span><span> </span><span class="attribute">class</span><span>=</span><span class="attribute-value">&#8216;groupclass&#8217;</span><span> </span><span class="attribute">name</span><span>=</span><span class="attribute-value">&#8216;group&#8217;</span><span> </span><span class="attribute">type</span><span>=</span><span class="attribute-value">&#8216;checkbox&#8217;</span><span class="tag">&gt;</span><span>chk1</span><span class="tag">&lt;</span><span class="tag-name">br</span><span class="tag">&gt;</span><span> </span></span></li>
<li class="alt"><span><span class="tag">&lt;</span><span class="tag-name">input</span><span> </span><span class="attribute">class</span><span>=</span><span class="attribute-value">&#8216;groupclass&#8217;</span><span> </span><span class="attribute">name</span><span>=</span><span class="attribute-value">&#8216;group&#8217;</span><span> </span><span class="attribute">type</span><span>=</span><span class="attribute-value">&#8216;checkbox&#8217;</span><span class="tag">&gt;</span><span>chk2</span><span class="tag">&lt;</span><span class="tag-name">br</span><span class="tag">&gt;</span><span> </span></span></li>
<li><span><span class="tag">&lt;</span><span class="tag-name">input</span><span> </span><span class="attribute">class</span><span>=</span><span class="attribute-value">&#8216;groupclass&#8217;</span><span> </span><span class="attribute">name</span><span>=</span><span class="attribute-value">&#8216;group&#8217;</span><span> </span><span class="attribute">type</span><span>=</span><span class="attribute-value">&#8216;checkbox&#8217;</span><span class="tag">&gt;</span><span>chk3</span><span class="tag">&lt;</span><span class="tag-name">br</span><span class="tag">&gt;</span><span> </span></span></li>
<li class="alt"><span><span class="tag">&lt;</span><span class="tag-name">input</span><span> </span><span class="attribute">class</span><span>=</span><span class="attribute-value">&#8216;groupclass&#8217;</span><span> </span><span class="attribute">name</span><span>=</span><span class="attribute-value">&#8216;group&#8217;</span><span> </span><span class="attribute">type</span><span>=</span><span class="attribute-value">&#8216;checkbox&#8217;</span><span class="tag">&gt;</span><span>chk4</span><span class="tag">&lt;</span><span class="tag-name">br</span><span class="tag">&gt;</span><span> </span></span></li>
<li><span><span class="tag">&lt;</span><span class="tag-name">input</span><span> </span><span class="attribute">type</span><span>=</span><span class="attribute-value">&#8216;checkbox&#8217;</span><span> </span><span class="attribute">class</span><span>=</span><span class="attribute-value">&#8216;checkall&#8217;</span><span class="tag">&gt;</span><span> </span></span></li>
</ol>
</div>
<p><textarea class="html" style="display: none;" cols="60" rows="30" name="code">&lt;input type=&#8217;checkbox&#8217; class=&#8217;checkall&#8217;&gt;checkall&lt;br&gt; &lt;input class=&#8217;groupclass&#8217; name=&#8217;group&#8217; type=&#8217;checkbox&#8217;&gt;chk1&lt;br&gt; &lt;input class=&#8217;groupclass&#8217; name=&#8217;group&#8217; type=&#8217;checkbox&#8217;&gt;chk2&lt;br&gt; &lt;input class=&#8217;groupclass&#8217; name=&#8217;group&#8217; type=&#8217;checkbox&#8217;&gt;chk3&lt;br&gt; &lt;input class=&#8217;groupclass&#8217; name=&#8217;group&#8217; type=&#8217;checkbox&#8217;&gt;chk4&lt;br&gt; &lt;input type=&#8217;checkbox&#8217; class=&#8217;checkall&#8217;&gt; </textarea></p>
<div class="dp-highlighter">
<div class="bar">
<div class="tools"><a onclick="dp.sh.Toolbar.Command('ViewSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">view plain</a><a onclick="dp.sh.Toolbar.Command('CopyToClipboard',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">copy to clipboard</a><a onclick="dp.sh.Toolbar.Command('PrintSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">print</a><a onclick="dp.sh.Toolbar.Command('About',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">?</a></div>
</div>
<ol class="dp-c">
<li class="alt"><span><span>$(</span><span class="string">&#8216;.checkall&#8217;</span><span>).checkgroup({ </span></span></li>
<li><span> groupSelector:<span class="string">&#8216;.groupclass&#8217;</span><span>, </span></span></li>
<li class="alt"><span> enabledOnly:<span class="keyword">true</span><span>, </span></span></li>
<li><span> onComplete: <span class="keyword">function</span><span>(boxes){ </span></span></li>
<li class="alt"><span> <span class="comment">//do something with the affected check boxes - boxes is an array</span><span> </span></span></li>
<li><span> } </span></li>
<li class="alt"><span> </span></li>
<li><span>}); </span></li>
</ol>
</div>
<p><textarea class="js" style="display: none;" cols="60" rows="30" name="code">$(&#8216;.checkall&#8217;).checkgroup({   groupSelector:&#8217;.groupclass&#8217;,   enabledOnly:true,   onComplete: function(boxes){                          //do something with the affected check boxes &#8211; boxes is an array                        }  }); </textarea></p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/psprintf">Perl semi-compatible sprintf</a></h3>
<p>Based on the functionality of the Perl implementation of sprintf.</p>
<div class="dp-highlighter">
<div class="bar">
<div class="tools"><a onclick="dp.sh.Toolbar.Command('ViewSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">view plain</a><a onclick="dp.sh.Toolbar.Command('CopyToClipboard',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">copy to clipboard</a><a onclick="dp.sh.Toolbar.Command('PrintSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">print</a><a onclick="dp.sh.Toolbar.Command('About',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">?</a></div>
</div>
<ol class="dp-xml">
<li class="alt"><span><span>$(&#8216;obj&#8217;).printf(&#8216;</span><span class="tag">&lt;</span><span class="tag-name">div</span><span class="tag">&gt;</span><span>Integer: %d, hex: %1$#x, HEX: %1$#X, Binary: %1$#b, BINARY: %1$#B, Octal: %1$#o, Float: %1$f, Exp: %1$e</span><span class="tag">&lt;/</span><span class="tag-name">div</span><span class="tag">&gt;</span><span>&#8216;, 123.456 ); </span></span></li>
</ol>
</div>
<p><textarea class="html" style="display: none;" cols="60" rows="30" name="code">$(&#8216;obj&#8217;).printf(&#8216;&lt;div&gt;Integer: %d, hex: %1$#x, HEX: %1$#X, Binary: %1$#b, BINARY: %1$#B, Octal: %1$#o, Float: %1$f, Exp: %1$e&lt;/div&gt;&#8217;, 123.456 ); </textarea></p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/EmptyText">EmptyText</a></h3>
<p>A simple plugin to set &#8220;default&#8221; text for a form field. When the field is empty, the default text is inserted, and when the user clicks in the field, the text is cleared.</p>
<div class="dp-highlighter">
<div class="bar">
<div class="tools"><a onclick="dp.sh.Toolbar.Command('ViewSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">view plain</a><a onclick="dp.sh.Toolbar.Command('CopyToClipboard',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">copy to clipboard</a><a onclick="dp.sh.Toolbar.Command('PrintSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">print</a><a onclick="dp.sh.Toolbar.Command('About',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">?</a></div>
</div>
<ol class="dp-c">
<li class="alt"><span><span>$(</span><span class="string">&#8220;:text&#8221;</span><span>).emptyText(</span><span class="string">&#8220;This text box is empty!&#8221;</span><span>, </span><span class="string">&#8220;Defaulted&#8221;</span><span>); </span></span></li>
</ol>
</div>
<p><textarea class="js" style="display: none;" cols="60" rows="30" name="code">$(&#8220;:text&#8221;).emptyText(&#8220;This text box is empty!&#8221;, &#8220;Defaulted&#8221;); </textarea></p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/easyinput">Easy Input</a></h3>
<p>The purpose of the plug in is to help mature-aged users, the visually impaired users and/or any user who is sick and tired of the tiny text inputs and areas, by providing a large display box that shows (in real-time) what you are typing into these areas (text inputs and text areas).</p>
<div class="dp-highlighter">
<div class="bar">
<div class="tools"><a onclick="dp.sh.Toolbar.Command('ViewSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">view plain</a><a onclick="dp.sh.Toolbar.Command('CopyToClipboard',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">copy to clipboard</a><a onclick="dp.sh.Toolbar.Command('PrintSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">print</a><a onclick="dp.sh.Toolbar.Command('About',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">?</a></div>
</div>
<ol class="dp-c">
<li class="alt"><span><span>$(document).ready(</span><span class="keyword">function</span><span>() { </span></span></li>
<li><span>$(<span class="string">&#8216;:text, :textarea&#8217;</span><span>).easyinput(); </span></span></li>
<li class="alt"><span>}); </span></li>
</ol>
</div>
<p><textarea class="js" style="display: none;" cols="60" rows="30" name="code">$(document).ready(function() { $(&#8216;:text, :textarea&#8217;).easyinput(); }); </textarea></p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/edit_in_place">Edit-in-Place</a></h3>
<p>Switches an element to a text input box, then when you&#8217;re done typing and hit enter/tab, it calls a callback.</p>
<div class="dp-highlighter">
<div class="bar">
<div class="tools"><a onclick="dp.sh.Toolbar.Command('ViewSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">view plain</a><a onclick="dp.sh.Toolbar.Command('CopyToClipboard',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">copy to clipboard</a><a onclick="dp.sh.Toolbar.Command('PrintSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">print</a><a onclick="dp.sh.Toolbar.Command('About',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">?</a></div>
</div>
<ol class="dp-c">
<li class="alt"><span><span>$(</span><span class="string">&#8216;#editable-thing&#8217;</span><span>).click(</span><span class="keyword">function</span><span>(){ </span></span></li>
<li><span> $(<span class="keyword">this</span><span>).edit_in_place(</span><span class="keyword">function</span><span>(editable_thing, value){ </span></span></li>
<li class="alt"><span> alert(<span class="string">&#8220;You typed &#8221;</span><span>+value); </span></span></li>
<li><span> }); </span></li>
<li class="alt"><span>}); </span></li>
</ol>
</div>
<p><textarea class="js" style="display: none;" cols="60" rows="30" name="code">$(&#8216;#editable-thing&#8217;).click(function(){     $(this).edit_in_place(function(editable_thing, value){         alert(&#8220;You typed &#8220;+value);     }); }); </textarea></p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/doubleselect">jQuery Doubleselect Plugin</a></h3>
<p>Fill in a second select box dependent on the first one</p>
<div class="dp-highlighter">
<div class="bar">
<div class="tools"><a onclick="dp.sh.Toolbar.Command('ViewSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">view plain</a><a onclick="dp.sh.Toolbar.Command('CopyToClipboard',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">copy to clipboard</a><a onclick="dp.sh.Toolbar.Command('PrintSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">print</a><a onclick="dp.sh.Toolbar.Command('About',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">?</a></div>
</div>
<ol class="dp-c">
<li class="alt"><span><span>$(document).ready(</span><span class="keyword">function</span><span>() </span></span></li>
<li><span>{ </span></li>
<li class="alt"><span> <span class="string">&#8220;Vegetables&#8221;</span><span>: { </span></span></li>
<li><span> <span class="string">&#8220;key&#8221;</span><span> : 10, </span></span></li>
<li class="alt"><span> <span class="string">&#8220;defaultvalue&#8221;</span><span> : 111, </span></span></li>
<li><span> <span class="string">&#8220;values&#8221;</span><span> : { </span></span></li>
<li class="alt"><span> <span class="string">&#8220;tomato&#8221;</span><span>: 110, </span></span></li>
<li><span> <span class="string">&#8220;potato&#8221;</span><span>: 111, </span></span></li>
<li class="alt"><span> <span class="string">&#8220;asparagus&#8221;</span><span>: 112 </span></span></li>
<li><span> } </span></li>
<li class="alt"><span> }, </span></li>
<li><span> <span class="string">&#8220;Fruits&#8221;</span><span>: { </span></span></li>
<li class="alt"><span> <span class="string">&#8220;key&#8221;</span><span> : 20, </span></span></li>
<li><span> <span class="string">&#8220;defaultvalue&#8221;</span><span> : 212, </span></span></li>
<li class="alt"><span> <span class="string">&#8220;values&#8221;</span><span> : { </span></span></li>
<li><span> <span class="string">&#8220;apple&#8221;</span><span>: 210, </span></span></li>
<li class="alt"><span> <span class="string">&#8220;orange&#8221;</span><span>: 211, </span></span></li>
<li><span> <span class="string">&#8220;kiwi&#8221;</span><span>: 212, </span></span></li>
<li class="alt"><span> <span class="string">&#8220;melon&#8221;</span><span>: 213 </span></span></li>
<li><span> } </span></li>
<li class="alt"><span> } </span></li>
<li><span> }; </span></li>
<li class="alt"><span> $(<span class="string">&#8216;#first&#8217;</span><span>).doubleSelect(</span><span class="string">&#8217;second&#8217;</span><span>, selectoptions); </span></span></li>
<li><span>}); </span></li>
<li class="alt"><span> </span></li>
</ol>
</div>
<p><textarea class="js" style="display: none;" cols="60" rows="30" name="code"> $(document).ready(function()  {     	    &#8220;Vegetables&#8221;: {     	         &#8220;key&#8221; : 10,                  &#8220;defaultvalue&#8221; : 111,     	         &#8220;values&#8221; : {                      &#8220;tomato&#8221;: 110,                      &#8220;potato&#8221;: 111,                      &#8220;asparagus&#8221;: 112                      }               },             &#8220;Fruits&#8221;: {                  &#8220;key&#8221; : 20,                  &#8220;defaultvalue&#8221; : 212,                  &#8220;values&#8221; : {                      &#8220;apple&#8221;: 210,                      &#8220;orange&#8221;: 211,                      &#8220;kiwi&#8221;: 212,                      &#8220;melon&#8221;: 213                      }               }     };     $(&#8216;#first&#8217;).doubleSelect(&#8217;second&#8217;, selectoptions);        }); </textarea></p>
<h3><a rel="nofollow" href="http://plugins.jquery.com/project/linkchecker">AJAX Broken Link Checker</a></h3>
<p><a rel="nofollow" href="http://plugins.jquery.com/project/linkchecker"><img src="http://www.ajaxline.com/files/" alt="" /></a>This module checks your links on the current page by requesting them and reading the server response. If the server returns 200 OK the link gets &#8216;active&#8217; class, if other header &#8211; the link marked as inactive.</p>
<div class="dp-highlighter">
<div class="bar">
<div class="tools"><a onclick="dp.sh.Toolbar.Command('ViewSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">view plain</a><a onclick="dp.sh.Toolbar.Command('CopyToClipboard',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">copy to clipboard</a><a onclick="dp.sh.Toolbar.Command('PrintSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">print</a><a onclick="dp.sh.Toolbar.Command('About',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">?</a></div>
</div>
<ol class="dp-c">
<li class="alt"><span><span>$(</span><span class="string">&#8216;a.goto&#8217;</span><span>).linkChecker({ linksAtOnce : 2, timeout: 4 }); </span></span></li>
</ol>
</div>
<p><textarea class="js" style="display: none;" cols="60" rows="30" name="code">$(&#8216;a.goto&#8217;).linkChecker({ linksAtOnce : 2, timeout: 4 }); </textarea></p>
<h3><a rel="nofollow" href="http://www.gimiti.com/kltan/wordpress/?p=43">jFade 1.0</a></h3>
<p>This plugin will easily allow you to do color transitions for text, background and borders for different events.</p>
<div class="dp-highlighter">
<div class="bar">
<div class="tools"><a onclick="dp.sh.Toolbar.Command('ViewSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">view plain</a><a onclick="dp.sh.Toolbar.Command('CopyToClipboard',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">copy to clipboard</a><a onclick="dp.sh.Toolbar.Command('PrintSource',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">print</a><a onclick="dp.sh.Toolbar.Command('About',this);return false;" href="http://www.ajaxline.com/best-jquery-plugins-june-2009#">?</a></div>
</div>
<ol class="dp-c">
<li class="alt"><span><span>$.fn.jFade.defaults = { </span></span></li>
<li><span> trigger: <span class="string">&#8220;load&#8221;</span><span>, </span></span></li>
<li class="alt"><span> property: <span class="string">&#8216;background&#8217;</span><span>, </span></span></li>
<li><span> start: <span class="string">&#8216;FFFFFF&#8217;</span><span>, </span></span></li>
<li class="alt"><span> end: <span class="string">&#8216;000000&#8242;</span><span>, </span></span></li>
<li><span> steps: 5, </span></li>
<li class="alt"><span> duration: 30 </span></li>
<li><span>};<br />
</span></li>
</ol>
</div>
</div>
]]></content:encoded>
			<wfw:commentRss>http://www.learningjquery.org/index.php/50-best-jquery-plugins/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>10 Rare and Cool jQuery Plugins</title>
		<link>http://www.learningjquery.org/index.php/10-rare-and-cool-jquery-plugins/</link>
		<comments>http://www.learningjquery.org/index.php/10-rare-and-cool-jquery-plugins/#comments</comments>
		<pubDate>Thu, 16 Jul 2009 09:16:35 +0000</pubDate>
		<dc:creator>Ben</dc:creator>
				<category><![CDATA[jQuery]]></category>
		<category><![CDATA[jQuery Plugins]]></category>
		<category><![CDATA[Plugins]]></category>

		<guid isPermaLink="false">http://www.learningjquery.org/?p=57</guid>
		<description><![CDATA[Introduction
I was hanging around jQUery plugin website, and I have found some really cool plugins.

 jQTouch &#124; Demo

A jQuery plugin with native animations, auto list navigation, and default application styles for Mobile WebKit browsers like iPhone, G1, and Pre.
 Fullsize &#124; Demo

Fullsize is an attempt to get a new &#60;IMG&#62; attribute called fullsize into the [...]]]></description>
			<content:encoded><![CDATA[<h2>Introduction</h2>
<p>I was hanging around jQUery plugin website, and I have found some really cool plugins.</p>
<ul id="simplelist">
<li> <a href="http://www.jqtouch.com/">jQTouch</a> | <a href="http://www.jqtouch.com/preview/">Demo</a><br />
<img src="http://www.queness.com/resources/images/rareplugin/jqtouch.gif" alt="" width="450" height="200" /><br />
<span>A jQuery plugin with native animations, auto list navigation, and default application styles for Mobile WebKit browsers like iPhone, G1, and Pre.</span></li>
<li> <a href="http://www.addfullsize.com/">Fullsize</a> | <a href="http://www.addfullsize.com/">Demo</a><br />
<img src="http://www.queness.com/resources/images/rareplugin/fullsize.gif" alt="" width="450" height="200" /><br />
<span>Fullsize is an attempt to get a new &lt;IMG&gt; attribute called fullsize into the next version of HTML. Hopefully this site will get the attention of the W3C, and they will add fullsize to HTML and make it a standard. </span></li>
<li> <a href="http://www.unwrongest.com/projects/airport/">Airport &#8211; Information Board Text Effect</a> | <a href="http://sandbox.unwrongest.com/jquery.airport/">Demo</a><br />
<img src="http://www.queness.com/resources/images/rareplugin/airport.gif" alt="" width="450" height="200" /><br />
<span>Airport is a rather simple text effect plugin for Jquery. It emulates the style of those flickering information boards you sometime find on airports and train stations.</span></li>
<li> <a href="http://www.kelvinluck.com/assets/jquery/jScrollPane/jScrollPane.html">jScrollPane</a> | <a href="http://www.kelvinluck.com/assets/jquery/jScrollPane/examples.html">Demo</a><br />
<img src="http://www.queness.com/resources/images/rareplugin/jscrollpane.gif" alt="" width="450" height="200" /><br />
<span>jScrollPane is a jquery plugin which allows you to replace the browsers default vertical scrollbars on any block level element with an overflow:auto style. You can easily control the apperance of the custom scrollbars using simple CSS. </span></li>
<li> <a href="http://codylindley.com/Javascript/264/jtip-a-jquery-tool-tip">jTip</a> | <a href="http://www.codylindley.com/blogstuff/js/jtip/">Demo</a><br />
<img src="http://www.queness.com/resources/images/rareplugin/jtip.gif" alt="" width="450" height="200" /><br />
<span>jTip pulls content into a tool tip using the HttpXMLRequest object. By adding a class attribute value of “jTip” to a link element you can create a tooltip from the content found in the file the href is pointing too.</span></li>
<li> <a href="http://tablesorter.com/docs/">TabSorter</a> | <a href="http://tablesorter.com/docs/#Demo">Demo</a><br />
<img src="http://www.queness.com/resources/images/rareplugin/tabsorter.gif" alt="" width="450" height="200" /><br />
<span>tablesorter is a jQuery plugin for turning a standard HTML table with THEAD and TBODY tags into a sortable table without page refreshes. </span></li>
<li> <a href="http://www.emposha.com/javascript/jquery/jquerymultiselect.html">FCBKcomplete</a> | <a href="http://www.emposha.com/demo/fcbkcomplete/">Demo</a><br />
<img src="http://www.queness.com/resources/images/rareplugin/fvbkcomplete.gif" alt="" width="450" height="200" /><br />
<span>Fancy facebook-like dynamic inputs with auto complete &amp; pre added values. If you have any comments or requests, please post them and I will try to include all the requested features in the upcoming release.</span></li>
<li> <a href="http://www.mopstudio.jp/mopTip2descrip.html">MopTip</a> | <a href="http://www.mopstudio.jp/mopTip2demo.html">Demo</a><br />
<img src="http://www.queness.com/resources/images/rareplugin/moptip.gif" alt="" width="450" height="200" /><br />
<span>MopTip is a elegant and beautiful customized tooltip. </span></li>
<li> <a href="http://www.mopstudio.jp/mopBox2descrip.html">MopBox</a> | <a href="http://www.mopstudio.jp/mopBox2demo.html">Demo</a><br />
<img src="http://www.queness.com/resources/images/rareplugin/mopbox.gif" alt="" width="450" height="200" /><br />
<span>MopBox is draggable show box that can contain div, image , flashmovie, video, etc. If it has more than one children, slider navigation is shown automatically.</span></li>
<li> <a href="http://www.mopstudio.jp/mopSlider2descrip.html">MopSlider</a> | <a href="http://www.mopstudio.jp/mopSlider2demo.html">Demo</a><br />
<img src="http://www.queness.com/resources/images/rareplugin/mopslider.gif" alt="" width="450" height="200" /><br />
<span>MopSlider is the slider box can contain any item that is set height &amp; width. From 2.2, MopSlider can be put 2 in the page.</span></li>
</ul>
<p>Don&#8217;t forget to share this article to show your support! <img src='http://www.learningjquery.cn/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
]]></content:encoded>
			<wfw:commentRss>http://www.learningjquery.org/index.php/10-rare-and-cool-jquery-plugins/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
