<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta content="jQuery Examples and FREE Javascript Code and Plugins, Ajax js, Net js, JQUERY, Prototype, Mootools ,html ,tooltip css, set html, javscript code, from differents frameworks  and free resources from around the web|Page-1" name="description"/>
<meta name="keywords" content="ajax,php,javascript,templates,frameworks, js, ajax plugins,net ajax,ajax manual, ajax jquery, jquery autocomplete,addons,javascript demos, scripting, XML, Web Services, php ajax,xslt, DHTML, web applications, Ajax JavaScript, javascript programming,scripts, jQuery, jQuery scripts, jQuery plugin,prototype,scriptaculous,mootools"/>
<title>
jQuery Examples, Ajax, Mootools Examples, Prototype Examples - Free Javascript html Code | AjaxShake.com
| Page-1
</title>
<base href="http://www.ajaxshake.com/"/>
<link rel="alternate" type="application/rss+xml" title="AjaxShake RSS Feed" href="http://feeds.feedburner.com/ajaxshake"/>
<link rel="stylesheet" href="public/resources/styles/all.3.0.min.css" type="text/css" media="screen, projection"/>
<link rel="shortcut icon" href="http://www.ajaxshake.com/favicon.ico"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body>
<div class="container">
<div id="showPictures"></div>
<div id="header" class="span-24 last">
<div class="headerLogo">
<div id="shaker"><a id="ajaxshakeLink" onclick="markinfo(1,'logo')" href="http://www.ajaxshake.com/"><img class="logo" alt="AJAXSHAKE" src="public/resources/images/logo.jpg"/></a></div>
</div>
<div id="sections">
<ul>
<li>
<h1><a rel="nofollow" class="sectionActive" href="http://www.ajaxshake.com/">Javascript Examples</a></h1>
</li>
</ul>
</div>
<div class="ilikeit">
</div>
<div class="plusone">
<g:plusone></g:plusone>
</div>
<div id="facebookLogin" class="facebookLogin">
</div>
<div class="socialItems">
<a rel="nofollow" target="_blank" href="http://feeds.feedburner.com/ajaxshake" title="Ajaxshake Feed Rss">
<img src="public/resources/images/social/feed.png"/>
</a>
<a rel="nofollow" target="_blank" href="http://www.facebook.com/pages/AjaxShake/126603027394570" title="Ajaxshake Facebook">
<img src="public/resources/images/social/facebook.png"/>
</a>
<a rel="nofollow" target="_blank" href="http://www.twitter.com/ajaxshake" title="Ajaxshake Twitter">
<img src="public/resources/images/social/twitter.png"/>
</a>
</div>
<div class="clear"></div>
<div class="lanBox">
<a href="javascript:void(0);"><img width='32px' height='32px' src="public/resources/images/eng32.png" alt="EN"/></a>
<a href="http://www.ajaxshake.com/es/JS.html"><img width='32px' height='32px' src="public/resources/images/spa32.png" alt="ES"/></a>
</div>
</div>
<div class="globalContent">
<div id="leftContent" class="span-15 first">
<div style="margin-bottom: 50px;">
 
<div id="bsap_1278345" class="bsarocks bsap_95111c43e0348a419d1a20d834c0b28f"></div>
 
<div class="clear"></div>
</div>
<div class="linkNewWin">
<div class="newWinOp"><input id="openLink" name="openLink" type="checkbox" onClick="openLink('http://www.ajaxshake.com/en/JS/nb');" checked /><label for="openLink">Open Links in a new Window</label></div>
</div>
<div class="post">
<div class="postTitle">
<h2 class="l ">
<a onclick="markinfo(1110,'Content')" href="http://www.ajaxshake.com/en/JS/2411101/multi-level-css3-menu-for-web-and-mobile-sites-multi-level-menu.html"> Multi level css3 Menu for web and mobile sites</a>
</h2>
</div>
<div class="clear"></div>
<div class="categoriesBar">
<div class="categoriesLinks">
<span class="tagLabel">Tags:</span>
<a rel="nofollow" onclick="markinfo(1,'category-b')" href="http://www.ajaxshake.com/en/JS/1111/jquery.html" class="barLink">JQUERY</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/2411101/multi-level-css3-menu-for-web-and-mobile-sites-multi-level-menu.html#comments" class="barLink"> | Comments(0)</a>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<p class="postDescription">
This amazing multilevel menu its resposive ,so you can use it on any device. It was made with css3 and it has differents demos with differents effects
<div class="centralImage">
<a rel="nofollow" title="Multi level css3 Menu for web and mobile sites&nbsp;-&nbsp;Multi level menu" href="http://www.ajaxshake.com/en/JS/2411101/multi-level-css3-menu-for-web-and-mobile-sites-multi-level-menu.html" onClick="showPictures(1110);return false;">
<img src="http://www.ajaxshake.com/public/usersFiles/main/link_user_1_8a6fc.jpg" alt="Multi level css3 Menu for web and mobile sites&nbsp;-&nbsp;Multi level menu" style="cursor:pointer;"/>
</a>
</div>
<div style="margin-bottom:50px;margin-top:50px">
<script type="text/javascript"><!--
                google_ad_client = "ca-pub-2827027577271242";
                /* Ajaxshake Banner 1 */
                google_ad_slot = "0453445685";
                google_ad_width = 728;
                google_ad_height = 90;
                //-->
                </script>
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
                </script>
</div>
<div class="bigSection">
<div class="tTip" title="
                    <span class='scriptInfo'><b>Multi level menu</b></span>
                    <br/>
                    <b>Requiriments:&nbsp;</b><br/>n/a<br/>                    <b>License:&nbsp;</b>N/D                    <br/>
                    <b>Size:&nbsp;</b>n/a&nbsp;(n/a)<br/>                    <b>Author:&nbsp;</b>&nbsp;Mary Lou                    <br/>
                    <span class='tipLanLabel'>Language:&nbsp;</span>
                    <img src='public/resources/images/eng24.png' /><div class='clear'></div> ">
<a rel="nofollow" class="bigLink linkDownloadEN" target="_blank" href="http://www.ajaxshake.com/plugin/EN/1110/bdcbe463/multi-level-css3-menu-for-web-and-mobile-sites-multi-level-menu.html" onClick="setView(1110,'EN');"></a>
</div>
<a rel="nofollow" class="bigLink linkDemoEN" target="_blank" href="http://www.ajaxshake.com/demo/EN/1110/bdcbe463/multi-level-css3-menu-for-web-and-mobile-sites-multi-level-menu.html" onClick="setView(1110,'EN');"></a>
</div>
</p>
</div>
<div class="post">
<div class="postTitle">
<h2 class="l ">
<a onclick="markinfo(1109,'Content')" href="http://www.ajaxshake.com/en/JS/2411091/how-to-create-an-amazing-multi-item-slider-multi-item-slider.html"> How to create an amazing multi item slider</a>
</h2>
</div>
<div class="clear"></div>
<div class="categoriesBar">
<div class="categoriesLinks">
<span class="tagLabel">Tags:</span>
<a rel="nofollow" onclick="markinfo(1,'category-b')" href="http://www.ajaxshake.com/en/JS/1111/jquery.html" class="barLink">JQUERY</a>
<span class="firstPost">,&nbsp;</span>
<a rel="nofollow" onclick="markinfo(58,'category-b')" href="http://www.ajaxshake.com/en/JS/12581/image-slider.html" class="barLink">image slider</a>
<span class="firstPost">,&nbsp;</span>
<a rel="nofollow" onclick="markinfo(9,'category-b')" href="http://www.ajaxshake.com/en/JS/1191/menus.html" class="barLink">Menus</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/2411091/how-to-create-an-amazing-multi-item-slider-multi-item-slider.html#comments" class="barLink"> | Comments(1)</a>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<p class="postDescription">
This tutorial shows you how to create an amazing multi-item slider with css3 and jQuery.
<div class="centralImage">
<a rel="nofollow" title="How to create an amazing multi item slider&nbsp;-&nbsp;Multi item slider" href="http://www.ajaxshake.com/en/JS/2411091/how-to-create-an-amazing-multi-item-slider-multi-item-slider.html" onClick="showPictures(1109);return false;">
<img src="public/resources/images/ajax-loader.gif" original="http://www.ajaxshake.com/public/usersFiles/main/link_user_1_8a7f7.jpg" alt="How to create an amazing multi item slider&nbsp;-&nbsp;Multi item slider" style="cursor:pointer;"/>
</a>
</div>
<div class="bigSection">
<div class="tTip" title="
                    <span class='scriptInfo'><b>Multi item slider</b></span>
                    <br/>
                    <b>Requiriments:&nbsp;</b><br/>jQuery<br/>                    <b>License:&nbsp;</b>N/D                    <br/>
                    <b>Size:&nbsp;</b>n/a&nbsp;(n/a)<br/>                    <b>Author:&nbsp;</b>&nbsp;Mary Lou                    <br/>
                    <span class='tipLanLabel'>Language:&nbsp;</span>
                    <img src='public/resources/images/eng24.png' /><div class='clear'></div> ">
<a rel="nofollow" class="bigLink linkDownloadEN" target="_blank" href="http://www.ajaxshake.com/plugin/EN/1109/43538b1a/how-to-create-an-amazing-multi-item-slider-multi-item-slider.html" onClick="setView(1109,'EN');"></a>
</div>
<a rel="nofollow" class="bigLink linkDemoEN" target="_blank" href="http://www.ajaxshake.com/demo/EN/1109/43538b1a/how-to-create-an-amazing-multi-item-slider-multi-item-slider.html" onClick="setView(1109,'EN');"></a>
</div>
</p>
</div>
<div class="post">
<div class="postTitle">
<h2 class="l ">
<a onclick="markinfo(1108,'Content')" href="http://www.ajaxshake.com/en/JS/2411081/javascript-file-and-module-loader-requirejs.html"> JavaScript file and module loader</a>
</h2>
</div>
<div class="clear"></div>
<div class="categoriesBar">
<div class="categoriesLinks">
<span class="tagLabel">Tags:</span>
<a rel="nofollow" onclick="markinfo(1,'category-b')" href="http://www.ajaxshake.com/en/JS/1111/jquery.html" class="barLink">JQUERY</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/2411081/javascript-file-and-module-loader-requirejs.html#comments" class="barLink"> | Comments(0)</a>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<p class="postDescription">
This library allows you to load on demand your javascript libraries and modules ,allowing you improve the speed and quality of your code.
<div class="centralImage">
<a rel="nofollow" title="JavaScript file and module loader&nbsp;-&nbsp;requirejs" href="http://www.ajaxshake.com/en/JS/2411081/javascript-file-and-module-loader-requirejs.html" onClick="showPictures(1108);return false;">
<img src="public/resources/images/ajax-loader.gif" original="http://www.ajaxshake.com/public/usersFiles/main/requirejs_user_1_af5fa.jpg" alt="JavaScript file and module loader&nbsp;-&nbsp;requirejs" style="cursor:pointer;"/>
</a>
</div>
<div class="bigSection">
<div class="tTip" title="
                    <span class='scriptInfo'><b>requirejs</b></span>
                    <br/>
                    <b>Requiriments:&nbsp;</b><br/>n/a<br/>                    <b>License:&nbsp;</b>N/D                    <br/>
                    <b>Size:&nbsp;</b>n/a&nbsp;(n/a)<br/>                    <b>Author:&nbsp;</b>&nbsp;requirejs                    <br/>
                    <span class='tipLanLabel'>Language:&nbsp;</span>
                    <img src='public/resources/images/eng24.png' /><div class='clear'></div> ">
<a rel="nofollow" class="bigLink linkDownloadEN" target="_blank" href="http://www.ajaxshake.com/plugin/EN/1108/7135e8dd/javascript-file-and-module-loader-requirejs.html" onClick="setView(1108,'EN');"></a>
</div>
<a rel="nofollow" class="bigLink linkDemoEN" target="_blank" href="http://www.ajaxshake.com/demo/EN/1108/7135e8dd/javascript-file-and-module-loader-requirejs.html" onClick="setView(1108,'EN');"></a>
</div>
</p>
</div>
<div class="ads4" style="margin-top:100px;">
<script type="text/javascript"><!--
        google_ad_client = "ca-pub-2827027577271242";
        /* Ajaxshake box */
        google_ad_slot = "8953530315";
        google_ad_width = 336;
        google_ad_height = 280;
        //-->
        </script>
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
        </script>
</div>
<div class="bigSection">
</div>
<div class="post">
<div class="postTitle">
<h2 class="l ">
<a onclick="markinfo(1107,'Content')" href="http://www.ajaxshake.com/en/JS/2411071/build-semantic-templates-with-javascript-handlebars.html"> Build semantic templates with javascript</a>
</h2>
</div>
<div class="clear"></div>
<div class="categoriesBar">
<div class="categoriesLinks">
<span class="tagLabel">Tags:</span>
<a rel="nofollow" onclick="markinfo(15,'category-b')" href="http://www.ajaxshake.com/en/JS/12151/javascript-examples.html" class="barLink">Javascript Examples</a>
<span class="firstPost">,&nbsp;</span>
<a rel="nofollow" onclick="markinfo(62,'category-b')" href="http://www.ajaxshake.com/en/JS/12621/styles.html" class="barLink">styles</a>
<span class="firstPost">,&nbsp;</span>
<a rel="nofollow" onclick="markinfo(133,'category-b')" href="http://www.ajaxshake.com/en/JS/131331/html5.html" class="barLink">HTML5</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/2411071/build-semantic-templates-with-javascript-handlebars.html#comments" class="barLink"> | Comments(1)</a>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<p class="postDescription">
This library allows you to crete html templates to be used with javascript, you can combine this library with others like jQuery , prototype, and create amazing ajax sites.
<div class="centralImage">
<a rel="nofollow" title="Build semantic templates with javascript&nbsp;-&nbsp;handlebars" href="http://www.ajaxshake.com/en/JS/2411071/build-semantic-templates-with-javascript-handlebars.html" onClick="showPictures(1107);return false;">
<img src="public/resources/images/ajax-loader.gif" original="http://www.ajaxshake.com/public/usersFiles/main/handlebars_user_1_8fd9a.jpg" alt="Build semantic templates with javascript&nbsp;-&nbsp;handlebars" style="cursor:pointer;"/>
</a>
</div>
<div class="bigSection">
<div class="tTip" title="
                    <span class='scriptInfo'><b>handlebars</b></span>
                    <br/>
                    <b>Requiriments:&nbsp;</b><br/>n/a<br/>                    <b>License:&nbsp;</b>N/D                    <br/>
                    <b>Size:&nbsp;</b>n/a&nbsp;(1.0)<br/>                    <b>Author:&nbsp;</b>&nbsp;handlebars                    <br/>
                    <span class='tipLanLabel'>Language:&nbsp;</span>
                    <img src='public/resources/images/eng24.png' /><div class='clear'></div> ">
<a rel="nofollow" class="bigLink linkDownloadEN" target="_blank" href="http://www.ajaxshake.com/plugin/EN/1107/5478eb48/build-semantic-templates-with-javascript-handlebars.html" onClick="setView(1107,'EN');"></a>
</div>
<a rel="nofollow" class="bigLink linkDemoEN" target="_blank" href="http://www.ajaxshake.com/demo/EN/1107/5478eb48/build-semantic-templates-with-javascript-handlebars.html" onClick="setView(1107,'EN');"></a>
</div>
</p>
</div>
<div class="post">
<div class="postTitle">
<h2 class="l ">
<a onclick="markinfo(1106,'Content')" href="http://www.ajaxshake.com/en/JS/2411061/load-content-when-scroll-on-a-web-site-infinite-scroll.html"> Load content when scroll on a web site</a>
</h2>
</div>
<div class="clear"></div>
<div class="categoriesBar">
<div class="categoriesLinks">
<span class="tagLabel">Tags:</span>
<a rel="nofollow" onclick="markinfo(1,'category-b')" href="http://www.ajaxshake.com/en/JS/1111/jquery.html" class="barLink">JQUERY</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/2411061/load-content-when-scroll-on-a-web-site-infinite-scroll.html#comments" class="barLink"> | Comments(0)</a>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<p class="postDescription">
This plugin allows you to load content when you scroll down on a web site,it speeds up scrolling through long lists and keeps your infinite feeds smooth and stable for your users
<div class="centralImage">
<a rel="nofollow" title="Load content when scroll on a web site&nbsp;-&nbsp;infinite-scroll" href="http://www.ajaxshake.com/en/JS/2411061/load-content-when-scroll-on-a-web-site-infinite-scroll.html" onClick="showPictures(1106);return false;">
<img src="public/resources/images/ajax-loader.gif" original="http://www.ajaxshake.com/public/usersFiles/main/infinite_user_1_4e945.jpg" alt="Load content when scroll on a web site&nbsp;-&nbsp;infinite-scroll" style="cursor:pointer;"/>
</a>
</div>
<div class="bigSection">
<div class="tTip" title="
                    <span class='scriptInfo'><b>infinite-scroll</b></span>
                    <br/>
                    <b>Requiriments:&nbsp;</b><br/>n/a<br/>                    <b>License:&nbsp;</b><a target='_blank' href='http://www.opensource.org/licenses/bsd-license.php'>BSD license</a>                    <br/>
                    <b>Size:&nbsp;</b>n/a&nbsp;(n/a)<br/>                    <b>Author:&nbsp;</b>&nbsp;infinite                    <br/>
                    <span class='tipLanLabel'>Language:&nbsp;</span>
                    <img src='public/resources/images/eng24.png' /><div class='clear'></div> ">
<a rel="nofollow" class="bigLink linkDownloadEN" target="_blank" href="http://www.ajaxshake.com/plugin/EN/1106/f60aea82/load-content-when-scroll-on-a-web-site-infinite-scroll.html" onClick="setView(1106,'EN');"></a>
</div>
<a rel="nofollow" class="bigLink linkDemoEN" target="_blank" href="http://www.ajaxshake.com/demo/EN/1106/f60aea82/load-content-when-scroll-on-a-web-site-infinite-scroll.html" onClick="setView(1106,'EN');"></a>
</div>
</p>
</div>
<div class="post">
<div class="postTitle">
<h2 class="l ">
<a onclick="markinfo(1105,'Content')" href="http://www.ajaxshake.com/en/JS/2411051/create-select-boxes-user-friendly-chosen.html"> Create select boxes user-friendly</a>
</h2>
</div>
<div class="clear"></div>
<div class="categoriesBar">
<div class="categoriesLinks">
<span class="tagLabel">Tags:</span>
<a rel="nofollow" onclick="markinfo(1,'category-b')" href="http://www.ajaxshake.com/en/JS/1111/jquery.html" class="barLink">JQUERY</a>
<span class="firstPost">,&nbsp;</span>
<a rel="nofollow" onclick="markinfo(70,'category-b')" href="http://www.ajaxshake.com/en/JS/12701/select-list.html" class="barLink">Select list</a>
<span class="firstPost">,&nbsp;</span>
<a rel="nofollow" onclick="markinfo(45,'category-b')" href="http://www.ajaxshake.com/en/JS/12451/forms.html" class="barLink">Forms</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/2411051/create-select-boxes-user-friendly-chosen.html#comments" class="barLink"> | Comments(0)</a>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<p class="postDescription">
This plugin javascript allows you to convert any traditional select element in an advance user=frendly component, you can use jquery or protototype and it can be use for single and multiple selections.
<div class="centralImage">
<a rel="nofollow" title="Create select boxes user-friendly&nbsp;-&nbsp;Chosen" href="http://www.ajaxshake.com/en/JS/2411051/create-select-boxes-user-friendly-chosen.html" onClick="showPictures(1105);return false;">
<img src="public/resources/images/ajax-loader.gif" original="http://www.ajaxshake.com/public/usersFiles/main/chosen2_user_1_27789.jpg" alt="Create select boxes user-friendly&nbsp;-&nbsp;Chosen" style="cursor:pointer;"/>
</a>
</div>
<div class="bigSection">
<div class="tTip" title="
                    <span class='scriptInfo'><b>Chosen</b></span>
                    <br/>
                    <b>Requiriments:&nbsp;</b><br/>jQuery<br/>                    <b>License:&nbsp;</b>N/D                    <br/>
                    <b>Size:&nbsp;</b>n/a&nbsp;(n/a)<br/>                    <b>Author:&nbsp;</b>&nbsp;harvest                    <br/>
                    <span class='tipLanLabel'>Language:&nbsp;</span>
                    <img src='public/resources/images/eng24.png' /><div class='clear'></div> ">
<a rel="nofollow" class="bigLink linkDownloadEN" target="_blank" href="http://www.ajaxshake.com/plugin/EN/1105/9e1d4db1/create-select-boxes-user-friendly-chosen.html" onClick="setView(1105,'EN');"></a>
</div>
<a rel="nofollow" class="bigLink linkDemoEN" target="_blank" href="http://www.ajaxshake.com/demo/EN/1105/9e1d4db1/create-select-boxes-user-friendly-chosen.html" onClick="setView(1105,'EN');"></a>
</div>
</p>
</div>
<div class="post">
<div class="postTitle">
<h2 class="l ">
<a onclick="markinfo(1104,'Content')" href="http://www.ajaxshake.com/en/JS/2411041/css3-animations-library-css3-animations.html"> Css3 animations library</a>
</h2>
</div>
<div class="clear"></div>
<div class="categoriesBar">
<div class="categoriesLinks">
<span class="tagLabel">Tags:</span>
<a rel="nofollow" onclick="markinfo(8,'category-b')" href="http://www.ajaxshake.com/en/JS/1181/css.html" class="barLink">CSS</a>
<span class="firstPost">,&nbsp;</span>
<a rel="nofollow" onclick="markinfo(62,'category-b')" href="http://www.ajaxshake.com/en/JS/12621/styles.html" class="barLink">styles</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/2411041/css3-animations-library-css3-animations.html#comments" class="barLink"> | Comments(0)</a>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<p class="postDescription">
This amazing library allows you to add animations to any html element. you can create transitions and effects just adding a class.
take a look to the examples
<div class="centralImage">
<a rel="nofollow" title="Css3 animations library&nbsp;-&nbsp;css3 animations" href="http://www.ajaxshake.com/en/JS/2411041/css3-animations-library-css3-animations.html" onClick="showPictures(1104);return false;">
<img src="public/resources/images/ajax-loader.gif" original="http://www.ajaxshake.com/public/usersFiles/main/animate_user_1_5b172.jpg" alt="Css3 animations library&nbsp;-&nbsp;css3 animations" style="cursor:pointer;"/>
</a>
</div>
<div class="bigSection">
<div class="tTip" title="
                    <span class='scriptInfo'><b>css3 animations</b></span>
                    <br/>
                                        <b>License:&nbsp;</b>N/D                    <br/>
                    <b>Size:&nbsp;</b>n/a&nbsp;(n/a)<br/>                    <b>Author:&nbsp;</b>&nbsp;n/a                    <br/>
                    <span class='tipLanLabel'>Language:&nbsp;</span>
                    <img src='public/resources/images/eng24.png' /><div class='clear'></div> ">
<a rel="nofollow" class="bigLink linkDownloadEN" target="_blank" href="http://www.ajaxshake.com/plugin/EN/1104/a46527ba/css3-animations-library-css3-animations.html" onClick="setView(1104,'EN');"></a>
</div>
<a rel="nofollow" class="bigLink linkDemoEN" target="_blank" href="http://www.ajaxshake.com/demo/EN/1104/a46527ba/css3-animations-library-css3-animations.html" onClick="setView(1104,'EN');"></a>
</div>
</p>
</div>
<div class="post">
<div class="postTitle">
<h2 class="l ">
<a onclick="markinfo(1103,'Content')" href="http://www.ajaxshake.com/en/JS/2411031/css3-expanding-overlay-effect-css3-clips.html"> Css3 Expanding Overlay Effect</a>
</h2>
</div>
<div class="clear"></div>
<div class="categoriesBar">
<div class="categoriesLinks">
<span class="tagLabel">Tags:</span>
<a rel="nofollow" onclick="markinfo(8,'category-b')" href="http://www.ajaxshake.com/en/JS/1181/css.html" class="barLink">CSS</a>
<span class="firstPost">,&nbsp;</span>
<a rel="nofollow" onclick="markinfo(62,'category-b')" href="http://www.ajaxshake.com/en/JS/12621/styles.html" class="barLink">styles</a>
<span class="firstPost">,&nbsp;</span>
<a rel="nofollow" onclick="markinfo(60,'category-b')" href="http://www.ajaxshake.com/en/JS/12601/animation.html" class="barLink">Animation</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/2411031/css3-expanding-overlay-effect-css3-clips.html#comments" class="barLink"> | Comments(0)</a>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<p class="postDescription">
This tutorial shows you how to create a simple expanding overlay effect with css3 using transitions and the clip property
<div class="centralImage">
<a rel="nofollow" title="Css3 Expanding Overlay Effect&nbsp;-&nbsp;Css3 clips" href="http://www.ajaxshake.com/en/JS/2411031/css3-expanding-overlay-effect-css3-clips.html" onClick="showPictures(1103);return false;">
<img src="public/resources/images/ajax-loader.gif" original="http://www.ajaxshake.com/public/usersFiles/main/link_user_1_55465.jpg" alt="Css3 Expanding Overlay Effect&nbsp;-&nbsp;Css3 clips" style="cursor:pointer;"/>
</a>
</div>
<div class="bigSection">
<div class="tTip" title="
                    <span class='scriptInfo'><b>Css3 clips</b></span>
                    <br/>
                                        <b>License:&nbsp;</b>N/D                    <br/>
                    <b>Size:&nbsp;</b>n/a&nbsp;(n/a)<br/>                    <b>Author:&nbsp;</b>&nbsp;Mary Lou                    <br/>
                    <span class='tipLanLabel'>Language:&nbsp;</span>
                    <img src='public/resources/images/eng24.png' /><div class='clear'></div> ">
<a rel="nofollow" class="bigLink linkDownloadEN" target="_blank" href="http://www.ajaxshake.com/plugin/EN/1103/7aa2c76d/css3-expanding-overlay-effect-css3-clips.html" onClick="setView(1103,'EN');"></a>
</div>
<a rel="nofollow" class="bigLink linkDemoEN" target="_blank" href="http://www.ajaxshake.com/demo/EN/1103/7aa2c76d/css3-expanding-overlay-effect-css3-clips.html" onClick="setView(1103,'EN');"></a>
</div>
</p>
</div>
<div class="post">
<div class="postTitle">
<h2 class="l ">
<a onclick="markinfo(1102,'Content')" href="http://www.ajaxshake.com/en/JS/2411021/grab-your-readers-s-attention-with-a-notification-bar-notibar.html"> Grab Your Readers's Attention with a notification bar</a>
</h2>
</div>
<div class="clear"></div>
<div class="categoriesBar">
<div class="categoriesLinks">
<span class="tagLabel">Tags:</span>
<a rel="nofollow" onclick="markinfo(1,'category-b')" href="http://www.ajaxshake.com/en/JS/1111/jquery.html" class="barLink">JQUERY</a>
<span class="firstPost">,&nbsp;</span>
<a rel="nofollow" onclick="markinfo(55,'category-b')" href="http://www.ajaxshake.com/en/JS/12551/tooltips.html" class="barLink">Tooltips</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/2411021/grab-your-readers-s-attention-with-a-notification-bar-notibar.html#comments" class="barLink"> | Comments(0)</a>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<p class="postDescription">
This site allows you to add a javascript notification bar on your web site. It has a wordpress plugin for easy inclusion.
<div class="centralImage">
<a rel="nofollow" title="Grab Your Readers's Attention with a notification bar&nbsp;-&nbsp;NotiBar" href="http://www.ajaxshake.com/en/JS/2411021/grab-your-readers-s-attention-with-a-notification-bar-notibar.html" onClick="showPictures(1102);return false;">
<img src="public/resources/images/ajax-loader.gif" original="http://www.ajaxshake.com/public/usersFiles/main/notibar_user_1_eb037.jpg" alt="Grab Your Readers's Attention with a notification bar&nbsp;-&nbsp;NotiBar" style="cursor:pointer;"/>
</a>
</div>
<div class="bigSection">
<div class="tTip" title="
                    <span class='scriptInfo'><b>NotiBar</b></span>
                    <br/>
                                        <b>License:&nbsp;</b>N/D                    <br/>
                    <b>Size:&nbsp;</b>n/a&nbsp;(v1.0)<br/>                    <b>Author:&nbsp;</b>&nbsp;Notibar.com                    <br/>
                    <span class='tipLanLabel'>Language:&nbsp;</span>
                    <img src='public/resources/images/eng24.png' /><div class='clear'></div> ">
<a rel="nofollow" class="bigLink linkDownloadEN" target="_blank" href="http://www.ajaxshake.com/plugin/EN/1102/82d7b838/grab-your-readers-s-attention-with-a-notification-bar-notibar.html" onClick="setView(1102,'EN');"></a>
</div>
<a rel="nofollow" class="bigLink linkDemoEN" target="_blank" href="http://www.ajaxshake.com/demo/EN/1102/82d7b838/grab-your-readers-s-attention-with-a-notification-bar-notibar.html" onClick="setView(1102,'EN');"></a>
</div>
</p>
</div>
<div class="post">
<div class="postTitle">
<h2 class="l ">
<a onclick="markinfo(1101,'Content')" href="http://www.ajaxshake.com/en/JS/2411011/plugin-for-spreading-items-in-a-card-like-fashion-baraja.html"> Plugin for spreading items in a card like fashion</a>
</h2>
</div>
<div class="clear"></div>
<div class="categoriesBar">
<div class="categoriesLinks">
<span class="tagLabel">Tags:</span>
<a rel="nofollow" onclick="markinfo(1,'category-b')" href="http://www.ajaxshake.com/en/JS/1111/jquery.html" class="barLink">JQUERY</a>
<span class="firstPost">,&nbsp;</span>
<a rel="nofollow" onclick="markinfo(60,'category-b')" href="http://www.ajaxshake.com/en/JS/12601/animation.html" class="barLink">Animation</a>
<span class="firstPost">,&nbsp;</span>
<a rel="nofollow" onclick="markinfo(63,'category-b')" href="http://www.ajaxshake.com/en/JS/12631/images-and-photos-.html" class="barLink">Images and photos </a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/2411011/plugin-for-spreading-items-in-a-card-like-fashion-baraja.html#comments" class="barLink"> | Comments(0)</a>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<p class="postDescription">
Baraja is an experimental and fun jQuery plugin that allows to move elements in a card-like fashion and spread them like one would spread a deck of cards on a table. It uses CSS transforms for rotating and translating the items. There are several options available that will create various spreading possibilities of the items, for example, moving the items laterally or rotating them in a fan-like way.
<div class="centralImage">
<a rel="nofollow" title="Plugin for spreading items in a card like fashion&nbsp;-&nbsp;BARAJA" href="http://www.ajaxshake.com/en/JS/2411011/plugin-for-spreading-items-in-a-card-like-fashion-baraja.html" onClick="showPictures(1101);return false;">
<img src="public/resources/images/ajax-loader.gif" original="http://www.ajaxshake.com/public/usersFiles/main/link_user_1_a293b.jpg" alt="Plugin for spreading items in a card like fashion&nbsp;-&nbsp;BARAJA" style="cursor:pointer;"/>
</a>
</div>
<div class="bigSection">
<div class="tTip" title="
                    <span class='scriptInfo'><b>BARAJA</b></span>
                    <br/>
                    <b>Requiriments:&nbsp;</b><br/>jQuery 1.6<br/>                    <b>License:&nbsp;</b>License Free                    <br/>
                    <b>Size:&nbsp;</b>n/a&nbsp;(v1.0)<br/>                    <b>Author:&nbsp;</b>&nbsp;PEDRO BOTELHO                    <br/>
                    <span class='tipLanLabel'>Language:&nbsp;</span>
                    <img src='public/resources/images/eng24.png' /><div class='clear'></div> ">
<a rel="nofollow" class="bigLink linkDownloadEN" target="_blank" href="http://www.ajaxshake.com/plugin/EN/1101/c208bd9b/plugin-for-spreading-items-in-a-card-like-fashion-baraja.html" onClick="setView(1101,'EN');"></a>
</div>
<a rel="nofollow" class="bigLink linkDemoEN" target="_blank" href="http://www.ajaxshake.com/demo/EN/1101/c208bd9b/plugin-for-spreading-items-in-a-card-like-fashion-baraja.html" onClick="setView(1101,'EN');"></a>
</div>
</p>
</div>
<div style="margin-bottom:50px;margin-top:50px">
<script type="text/javascript"><!--
        google_ad_client = "ca-pub-2827027577271242";
        /* Ajaxshake Banner 3 */
        google_ad_slot = "3617376850";
        google_ad_width = 728;
        google_ad_height = 90;
        //-->
        </script>
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
        </script>
</div>
</div>
<div id="rightContent" class="span-9 last">
<div id="search">
<input type="text" name="searchBox" id="searchBox" onkeypress="checkKey(event);" value="Search ..." onfocus="checkSearch(this,'Search ...')"/>
<a rel="nofollow" id="searchbutton" href="javascript:void(0);" onclick="searchString('http://www.ajaxshake.com/en/JS')"><img alt="Search" src="public/resources/images/searchButton.gif"/></a>
<div class="searchFound">
</div>
<div class="clear"></div>
</div>
<div class="generalOptions">
<div class="inner" style="width:256px;">
<div id="filterLoadIcon" class="l dn"><img alt="Loading ..." src="public/resources/images/ajax-loader.gif"/></div>
<a rel="nofollow" href="javascript:void(0);" class="filterSelectLink">Filter By Category</a>
<div class="clear"></div>
<div id="filterAdder">
<div class="filterSelect" style="display:none;">
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12101/accordions.html" data-id="10">Accordions</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/131351/android.html" data-id="135">Android</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12601/animation.html" data-id="60">Animation</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12831/asp-net.html" data-id="83">ASP.NET</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/131341/audio.html" data-id="134">Audio</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12521/autocomplete.html" data-id="52">Autocomplete</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12941/banners.html" data-id="94">Banners</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12781/buttons.html" data-id="78">Buttons</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/1151/calendars.html" data-id="5">Calendars</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12901/captcha.html" data-id="90">Captcha</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12951/caption.html" data-id="95">Caption</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12971/carousel.html" data-id="97">Carousel</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12361/charts.html" data-id="36">Charts</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/131141/chat.html" data-id="114">Chat</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12711/checkbox.html" data-id="71">Checkbox</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12141/clocks.html" data-id="14">Clocks</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12671/color-picker.html" data-id="67">Color Picker</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12841/counters.html" data-id="84">Counters</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12691/crop-resize.html" data-id="69">Crop-resize</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/1181/css.html" data-id="8">CSS</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/131181/database.html" data-id="118">DataBase</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12501/dates-pickers.html" data-id="50">Dates Pickers</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12791/dijit.html" data-id="79">Dijit</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12771/dojo.html" data-id="77">Dojo</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12761/drag-and-drop.html" data-id="76">Drag and Drop</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12731/encryption.html" data-id="73">Encryption</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12991/ext-js.html" data-id="99">Ext.JS</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/131001/filter.html" data-id="100">Filter</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/1141/flash.html" data-id="4">Flash</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12911/fonts.html" data-id="91">Fonts</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12451/forms.html" data-id="45">Forms</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12131/galleries.html" data-id="13">Galleries</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/1171/grid.html" data-id="7">Grid</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/131161/html-wysiwyg-editors.html" data-id="116">Html WYSIWYG editors</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/131331/html5.html" data-id="133">HTML5</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/131191/icons.html" data-id="119">Icons</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12581/image-slider.html" data-id="58">image slider</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12631/images-and-photos-.html" data-id="63">Images and photos </a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/1111/jquery.html" data-id="1">JQUERY</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12261/lightbox.html" data-id="26">LightBox</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12541/login.html" data-id="54">login</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/131171/maps.html" data-id="117">Maps</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/1191/menus.html" data-id="9">Menus</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/131321/mobile.html" data-id="132">Mobile</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12741/modal-windows.html" data-id="74">Modal Windows</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12861/moo-fx.html" data-id="86">Moo.FX</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12111/mootools.html" data-id="11">Mootools</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12981/mouseover-.html" data-id="98">Mouseover </a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12571/order-reorder.html" data-id="57">Order/Reorder</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12611/pagination.html" data-id="61">pagination</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12531/php.html" data-id="53">PHP</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12641/popup.html" data-id="64">popup</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/1121/prototype.html" data-id="2">Prototype</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12421/pure-javascript.html" data-id="42">Pure JavaScript</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12821/ranking.html" data-id="82">Ranking</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12751/resize.html" data-id="75">Resize</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/1131/scriptaculous.html" data-id="3">Scriptaculous</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12561/scrollable.html" data-id="56">Scrollable</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12701/select-list.html" data-id="70">Select list</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12921/sort.html" data-id="92">Sort</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/131201/source-code.html" data-id="120">Source Code</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12621/styles.html" data-id="62">styles</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12681/tables.html" data-id="68">Tables</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12121/tabs.html" data-id="12">tabs</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12931/tag-cloud.html" data-id="93">Tag Cloud</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12961/text.html" data-id="96">Text</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12511/time-picker.html" data-id="51">Time Picker</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12551/tooltips.html" data-id="55">Tooltips</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12591/transition.html" data-id="59">Transition</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/131211/translators.html" data-id="121">Translators</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12871/tree.html" data-id="87">Tree</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12661/tutorial.html" data-id="66">Tutorial</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/131221/uize.html" data-id="122">UIZE</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12811/upload-files.html" data-id="81">Upload Files</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12851/utilities.html" data-id="85">Utilities</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12441/validation.html" data-id="44">Validation</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12801/video.html" data-id="80">Video</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/131011/web-mail.html" data-id="101">Web Mail</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12881/xhtml-editor.html" data-id="88">XHTML editor</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12891/yui.html" data-id="89">YUI</a>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12721/zoom.html" data-id="72">Zoom</a>
</div>
</div>
</div>
</div>
<div id="sky">
<div id="cloud">
<div class="inner">
 
<div id="bsap_1272111" class="bsarocks bsap_95111c43e0348a419d1a20d834c0b28f"></div>
 
 
 
<div id="bsap_1258716" class="bsarocks bsap_95111c43e0348a419d1a20d834c0b28f"></div>
 
</div>
<div class="clear"></div>
<div style="margin-left: 32px;margin-top: 15px; margin-bottom: 10px;">
<a target="_blank" title="PSD to HTML" href="http://www.css4me.com/order-display/?utm_source=ajaxshake&utm_medium=255x125&utm_term=PSD%2Bto%2BHTML&utm_campaign=OrderNow"><img src="/public/resources/images/psd-to-html.gif" alt="PSD to HTML"/></a>
</div>
 
<div id="categories">
<div>
<ul class="categoriesSection" style="height:800px;">
<li class="title">
<h3 class="titleLabel">Categories</h3>
<div class="titleLine"></div>
</li>
<li>
<a onclick="markinfo(9,'category-c')" href="http://www.ajaxshake.com/en/JS/1191/menus.html" class="sectionLink">Menus</a><span class="sectionLink"> (130)</span>
</li>
<li>
<a onclick="markinfo(13,'category-c')" href="http://www.ajaxshake.com/en/JS/12131/galleries.html" class="sectionLink">Galleries</a><span class="sectionLink"> (239)</span>
</li>
<li>
<a onclick="markinfo(58,'category-c')" href="http://www.ajaxshake.com/en/JS/12581/image-slider.html" class="sectionLink">image slider</a><span class="sectionLink"> (164)</span>
</li>
<li>
<a onclick="markinfo(26,'category-c')" href="http://www.ajaxshake.com/en/JS/12261/lightbox.html" class="sectionLink">LightBox</a><span class="sectionLink"> (56)</span>
</li>
<li>
<a onclick="markinfo(45,'category-c')" href="http://www.ajaxshake.com/en/JS/12451/forms.html" class="sectionLink">Forms</a><span class="sectionLink"> (57)</span>
</li>
<li>
<a onclick="markinfo(10,'category-c')" href="http://www.ajaxshake.com/en/JS/12101/accordions.html" class="sectionLink">Accordions</a><span class="sectionLink"> (32)</span>
</li>
<li>
<a onclick="markinfo(5,'category-c')" href="http://www.ajaxshake.com/en/JS/1151/calendars.html" class="sectionLink">Calendars</a><span class="sectionLink"> (35)</span>
</li>
<li>
<a onclick="markinfo(60,'category-c')" href="http://www.ajaxshake.com/en/JS/12601/animation.html" class="sectionLink">Animation</a><span class="sectionLink"> (126)</span>
</li>
<li>
<a onclick="markinfo(7,'category-c')" href="http://www.ajaxshake.com/en/JS/1171/grid.html" class="sectionLink">Grid</a><span class="sectionLink"> (22)</span>
</li>
<li>
<a onclick="markinfo(53,'category-c')" href="http://www.ajaxshake.com/en/JS/12531/php.html" class="sectionLink">PHP</a><span class="sectionLink"> (48)</span>
</li>
<li>
<a onclick="markinfo(54,'category-c')" href="http://www.ajaxshake.com/en/JS/12541/login.html" class="sectionLink">login</a><span class="sectionLink"> (16)</span>
</li>
<li>
<a onclick="markinfo(59,'category-c')" href="http://www.ajaxshake.com/en/JS/12591/transition.html" class="sectionLink">Transition</a><span class="sectionLink"> (39)</span>
</li>
<li>
<a onclick="markinfo(64,'category-c')" href="http://www.ajaxshake.com/en/JS/12641/popup.html" class="sectionLink">popup</a><span class="sectionLink"> (16)</span>
</li>
<li>
<a onclick="markinfo(74,'category-c')" href="http://www.ajaxshake.com/en/JS/12741/modal-windows.html" class="sectionLink">Modal Windows</a><span class="sectionLink"> (19)</span>
</li>
<li>
<a onclick="markinfo(97,'category-c')" href="http://www.ajaxshake.com/en/JS/12971/carousel.html" class="sectionLink">Carousel</a><span class="sectionLink"> (40)</span>
</li>
<li>
<a onclick="markinfo(12,'category-c')" href="http://www.ajaxshake.com/en/JS/12121/tabs.html" class="sectionLink">tabs</a><span class="sectionLink"> (27)</span>
</li>
<li>
<a onclick="markinfo(44,'category-c')" href="http://www.ajaxshake.com/en/JS/12441/validation.html" class="sectionLink">Validation</a><span class="sectionLink"> (19)</span>
</li>
<li>
<a onclick="markinfo(55,'category-c')" href="http://www.ajaxshake.com/en/JS/12551/tooltips.html" class="sectionLink">Tooltips</a><span class="sectionLink"> (26)</span>
</li>
<li>
<a onclick="markinfo(56,'category-c')" href="http://www.ajaxshake.com/en/JS/12561/scrollable.html" class="sectionLink">Scrollable</a><span class="sectionLink"> (16)</span>
</li>
<li>
<a onclick="markinfo(63,'category-c')" href="http://www.ajaxshake.com/en/JS/12631/images-and-photos-.html" class="sectionLink">Images and photos </a><span class="sectionLink"> (63)</span>
</li>
<li>
<div class="more">
<div class="moreLink l">
</div>
<div class="moreLink r">
<a rel="nofollow" onclick="getNextCategoryPage(1,3,'JS','categories','EN',20)" href="javascript:void(0)">More</a> </div>
</div>
</li>
</ul>
</div> </div>
<div class="faceMaxBox">
<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like-box href="http://www.facebook.com/ajaxshake" width="254" show_faces="true" border_color="" stream="false" header="false"></fb:like-box>
</div>
<div id="libraries">
<div>
<ul class="categoriesSection" style="height:512px;">
<li class="title">
<h3 class="titleLabel">Libraries</h3>
<div class="titleLine"></div>
</li>
<li>
<a onclick="markinfo(1,'category-l')" href="http://www.ajaxshake.com/en/JS/1111/jquery.html" class="sectionLink">JQUERY</a><span class="sectionLink"> (679)</span>
</li>
<li>
<a onclick="markinfo(4,'category-l')" href="http://www.ajaxshake.com/en/JS/1141/flash.html" class="sectionLink">Flash</a><span class="sectionLink"> (22)</span>
</li>
<li>
<a onclick="markinfo(42,'category-l')" href="http://www.ajaxshake.com/en/JS/12421/pure-javascript.html" class="sectionLink">Pure JavaScript</a><span class="sectionLink"> (80)</span>
</li>
<li>
<a onclick="markinfo(2,'category-l')" href="http://www.ajaxshake.com/en/JS/1121/prototype.html" class="sectionLink">Prototype</a><span class="sectionLink"> (43)</span>
</li>
<li>
<a onclick="markinfo(8,'category-l')" href="http://www.ajaxshake.com/en/JS/1181/css.html" class="sectionLink">CSS</a><span class="sectionLink"> (69)</span>
</li>
<li>
<a onclick="markinfo(11,'category-l')" href="http://www.ajaxshake.com/en/JS/12111/mootools.html" class="sectionLink">Mootools</a><span class="sectionLink"> (95)</span>
</li>
<li>
<a onclick="markinfo(77,'category-l')" href="http://www.ajaxshake.com/en/JS/12771/dojo.html" class="sectionLink">Dojo</a><span class="sectionLink"> (2)</span>
</li>
<li>
<a onclick="markinfo(101,'category-l')" href="http://www.ajaxshake.com/en/JS/131011/web-mail.html" class="sectionLink">Web Mail</a><span class="sectionLink"> (4)</span>
</li>
<li>
<a onclick="markinfo(119,'category-l')" href="http://www.ajaxshake.com/en/JS/131191/icons.html" class="sectionLink">Icons</a><span class="sectionLink"> (3)</span>
</li>
<li>
<a onclick="markinfo(89,'category-l')" href="http://www.ajaxshake.com/en/JS/12891/yui.html" class="sectionLink">YUI</a><span class="sectionLink"> (5)</span>
</li>
<li>
<a onclick="markinfo(99,'category-l')" href="http://www.ajaxshake.com/en/JS/12991/ext-js.html" class="sectionLink">Ext.JS</a><span class="sectionLink"> (1)</span>
</li>
<li>
<a onclick="markinfo(122,'category-l')" href="http://www.ajaxshake.com/en/JS/131221/uize.html" class="sectionLink">UIZE</a><span class="sectionLink"> (1)</span>
</li>
<li>
<div class="more">
<div class="moreLink l">
</div>
<div class="moreLink r">
<a rel="nofollow" onclick="getNextCategoryPage(1,1,'JS','libraries','EN',12)" href="javascript:void(0)">More</a> </div>
</div>
</li>
</ul>
</div> </div>
<div class="faceMaxBox videosBanner" style="margin-left: 32px;margin-top: 60px;">
<a href="http://www.md5decrypt.org"><img width="255px" src="public/resources/images/md5-banner.jpg" alt="md5 decrypt"/></a>
</div>
</div>  
<div class="clear"></div>
<div class="commentBoxPanel">
<div class="commentTitle">
<img src="public/resources/images/bubble.gif"/>
<h3 class="titleLabel">Recent Comments</h3>
</div>
<div class="mainComment">
<h4>
ludi said:
</h4>
<div class="mainCommentInfo">
<a target="_blank" href="http://www.facebook.com/ludal1472@hotmail.com" rel="nofollow"> <img src="public/resources/images/miniFacebook.png"/></a> </div>
<div class="clear"></div>
<p>como descargo</p>
<div class="commentLinks">
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/2411091/how-to-create-an-amazing-multi-item-slider-multi-item-slider.html">How to create an amazing multi item slider</a>
</div>
</div>
<div class="mainComment">
<h4>
daniela said:
</h4>
<div class="mainCommentInfo">
</div>
<div class="clear"></div>
<p>Hola</p>
<div class="commentLinks">
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/2410741/jquery-slideshow-diapo.html">jQuery slideshow</a>
</div>
</div>
<div class="mainComment">
<h4>
hitesh said:
</h4>
<div class="mainCommentInfo">
</div>
<div class="clear"></div>
<p>good</p>
<div class="commentLinks">
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/2410991/plugin-jquery-to-flip-content-bookblock.html">Plugin jQuery to Flip Content</a>
</div>
</div>
<div class="mainComment">
<h4>
Moeed Khan said:
</h4>
<div class="mainCommentInfo">
<a target="_blank" href="http://www.twitter.com/momokhanz" rel="nofollow"> <img src="public/resources/images/miniTwitter.png"/></a> <a target="_blank" href="http://fashionclicx.com" rel="nofollow"> <img src="public/resources/images/net.png"/></a> </div>
<div class="clear"></div>
<p>@Surendra Mishra you can download it from below URL:
http://thefinishedbox.com/?download=loginfreebie ...</p>
<div class="commentLinks">
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/238291/a-simple-jquery-dropdown-login-form-loginform.html">A Simple jQuery Dropdown Login Form</a>
</div>
</div>
<div class="mainComment">
<h4>
Nick said:
</h4>
<div class="mainCommentInfo">
</div>
<div class="clear"></div>
<p>It's ok!</p>
<div class="commentLinks">
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/239961/mootoos-tree-menu-mootoolstreemenu.html">Mootoos Tree Menu</a>
</div>
</div>
<div class="mainComment">
<h4>
Sergio said:
</h4>
<div class="mainCommentInfo">
</div>
<div class="clear"></div>
<p>Gracias</p>
<div class="commentLinks">
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/233531/scrolling-to-the-top-and-bottom-with-jquery-scrolling-top.html">Scrolling to the Top and Bottom with jQuery</a>
</div>
</div>
<div class="mainComment">
<h4>
Krzysztof Bekisz said:
</h4>
<div class="mainCommentInfo">
</div>
<div class="clear"></div>
<p>I am interested for now. Any comment later.</p>
<div class="commentLinks">
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/234681/create-an-image-rotator-with-description-in-javascript-imagerotator.html">Create an Image Rotator with Description in Javascript</a>
</div>
</div>
<div class="mainComment">
<h4>
Chris C said:
</h4>
<div class="mainCommentInfo">
</div>
<div class="clear"></div>
<p>How is this different/better than twig or h2o-template?</p>
<div class="commentLinks">
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/2411071/build-semantic-templates-with-javascript-handlebars.html">Build semantic templates with javascript</a>
</div>
</div>
<div class="mainComment">
<h4>
Surendra Mishra said:
</h4>
<div class="mainCommentInfo">
</div>
<div class="clear"></div>
<p>I do not see any link to download code for login.
Request you to please help me.
Thanks
Surendra</p>
<div class="commentLinks">
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/238291/a-simple-jquery-dropdown-login-form-loginform.html">A Simple jQuery Dropdown Login Form</a>
</div>
</div>
<div class="mainComment">
<h4>
Alhassan said:
</h4>
<div class="mainCommentInfo">
<a target="_blank" href="http://www.twitter.com/alhassanbaba2" rel="nofollow"> <img src="public/resources/images/miniTwitter.png"/></a> </div>
<div class="clear"></div>
<p>Thnaks for the code its awesome</p>
<div class="commentLinks">
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/238291/a-simple-jquery-dropdown-login-form-loginform.html">A Simple jQuery Dropdown Login Form</a>
</div>
</div>
</div>
</div>  
</div>
<div class="clear"></div>
</div>
<div id="footer" class="span-24 last">
<div class="span-15 l">
<div class="pagination" id="Pagination">
<span class="current prev">Prev</span>
<span class="current">1</span>
<a class="pageTipElement" href="http://www.ajaxshake.com/en/JS/Page/2">2</a>
<a class="pageTipElement" href="http://www.ajaxshake.com/en/JS/Page/3">3</a>
<a class="pageTipElement" href="http://www.ajaxshake.com/en/JS/Page/4">4</a>
<a class="pageTipElement" href="http://www.ajaxshake.com/en/JS/Page/5">5</a>
<a class="pageTipElement" href="http://www.ajaxshake.com/en/JS/Page/6">6</a>
<a class="pageTipElement" href="http://www.ajaxshake.com/en/JS/Page/7">7</a>
<a class="pageTipElement" href="http://www.ajaxshake.com/en/JS/Page/8">8</a>
<a class="pageTipElement" href="http://www.ajaxshake.com/en/JS/Page/9">9</a>
<a class="pageTipElement" href="http://www.ajaxshake.com/en/JS/Page/10">10</a>
<span>...</span>
																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																																							                        <a class="pageTipElement" href="http://www.ajaxshake.com/en/JS/Page/101">101</a>
<a class="pageTipElement" href="http://www.ajaxshake.com/en/JS/Page/102">102</a>
<a href="http://www.ajaxshake.com/en/JS/Page/2" class="next">Next</a>
</div>
</div>
</div>
<div class="clear"></div>
</div>
<div id="pageTip" class="span-15 pageTipBox"></div>
<div id="foot">
<div class="foot">
<div class="foot1">
<div class="span-5 foot3">
<h4 class="footLabel">Categories</h4>
<ul>
<li>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12661/tutorial.html">Tutorial</a>,
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12701/select-list.html">Select list</a>
</li>
<li>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12721/zoom.html">Zoom</a>,
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12781/buttons.html">Buttons</a>
</li>
<li>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12981/mouseover-.html">Mouseover </a>,
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/131181/database.html">DataBase</a>
</li>
<li>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12141/clocks.html">Clocks</a>,
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12361/charts.html">Charts</a>
</li>
<li>
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12501/dates-pickers.html">Dates Pickers</a>,
<a rel="nofollow" href="http://www.ajaxshake.com/en/JS/12521/autocomplete.html">Autocomplete</a>
</li>
</ul>
</div>
<div class="span-5 foot3">
<h4 class="footLabel">Content</h4>
<ul>
<li>
<a rel="nofollow" href="http://www.ajaxshake.com/EN/JS/search/slider.html">slider</a>,
<a rel="nofollow" href="http://www.ajaxshake.com/EN/JS/search/menu.html">menu</a>
</li>
<li>
<a rel="nofollow" href="http://www.ajaxshake.com/EN/JS/search/calendario-jquery.html">calendario-jquery</a>,
<a rel="nofollow" href="http://www.ajaxshake.com/EN/JS/search/galeria.html">galeria</a>
</li>
<li>
<a rel="nofollow" href="http://www.ajaxshake.com/EN/JS/search/simple-jquery-slideshow.html">simple-jquery-slideshow</a>,
<a rel="nofollow" href="http://www.ajaxshake.com/EN/JS/search/h.html">h</a>
</li>
<li>
<a rel="nofollow" href="http://www.ajaxshake.com/EN/JS/search/jquery.html">jquery</a>,
<a rel="nofollow" href="http://www.ajaxshake.com/EN/JS/search/a.html">a</a>
</li>
<li>
<a rel="nofollow" href="http://www.ajaxshake.com/EN/JS/search/imagenes.html">imagenes</a>,
<a rel="nofollow" href="http://www.ajaxshake.com/EN/JS/search/hover-image.html">hover-image</a>
</li>
</ul>
</div>
<div class="span-5 foot3">
<h4 class="footLabel">Friend Sites</h4>
<ul>
<li><a rel="nofollow" href="http://solvingequations.net">Solving Equations</a></li>
<li><a target="_new" href="http://www.css4me.com/?utm_source=ajaxshake&utm_medium=text&utm_term=psd%2Bto%2Bcss&utm_campaign=homepage">PSD to CSS</a></li>
</ul>
</div>
<div class="span-5 foot4">
<h4 class="footLabel">Contact Us</h4>
<ul>
<li><a rel="nofollow" href="mailto:info@ajaxshake.com">Feed Back</a></li>
<li><a rel="nofollow" href="mailto:info@ajaxshake.com">E-mail</a></li>
<li><a rel="nofollow" href="mailto:info@ajaxshake.com">Advertise with us!</a></li>
</ul>
</div>
<div class="span-3 last foot3">
<h4 class="footLabel">Follow Us</h4>
<ul>
<li><a rel="nofollow" href="http://www.twitter.com/ajaxshake">Twitter</a></li>
<li><a rel="nofollow" href="http://www.facebook.com/pages/AjaxShake/126603027394570">Facebook</a></li>
<li><a rel="nofollow" href="http://feeds.feedburner.com/ajaxshake">Feed Rss</a></li>
</ul>
</div>
</div>
<div class="foot2">
</div>
</div>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
			var language='EN';
            $(document).ready(function() {
                //-----------------------------------
                var addScript=function(strvar){
                    var script = document.createElement('script');
                    script.type = 'text/javascript';
                    script.async = true;
                    script.src = strvar;
                    (document.getElementsByTagName('head')[0]||document.getElementsByTagName('body')[0]).appendChild(script);
                }
                //-----------------------------------
                                    $(".ilikeit").html('<iframe src="http://www.facebook.com/plugins/like.php?href=http://www.facebook.com/pages/AjaxShake/126603027394570&amp;layout=button_count&amp;action=like&amp;height=21&amp;width:120" scrolling="no" frameborder="0" style="border:none; width:120px; height:21px"></iframe>');
                				addScript('https://apis.google.com/js/plusone.js');
                addScript('public/resources/js/all.3.0.min.js');
                addScript('//s3.buysellads.com/ac/bsa.js');
                //$('#specialAd').html('<a style="border: 0" href="http://www.chaludesign.com.ar" target="_blank" rel="nofollow"><img src="public/resources/images/chaludesign.jpg" alt="" /></a>');
		});// document ready
        </script>
 
<img width='212px' height='32px' src="public/resources/lib/tips/images/tipMid.png" class="dn"/>
<img width='212px' height='1px' src="public/resources/lib/tips/images/tipBtm.png" class="dn"/>
<img width='212px' height='37px' src="public/resources/lib/tips/images/tipTop.png" class="dn"/>
<script type="text/javascript">
            window.google_analytics_uacct = "UA-16213975-1";
        </script>
<script type="text/javascript">
            var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
            document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
        </script>
<script type="text/javascript">
            try {
                var pageTracker = _gat._getTracker("UA-16213975-1");
                pageTracker._setDomainName(".ajaxshake.com");
                pageTracker._trackPageview();
            } catch(err) {}
        </script>
</body>
</html>