<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html slick-uniqueid="3" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-gb" lang="en-gb"><head>
    <!-- base href="http://www.hotajax.org/" -->
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <meta name="keywords" content="web application,open-source,ajax,javascript,web resources,web design,jQuery,MooTools">
  <meta name="description" content="Hot!Ajax is a blog aimed to share top quality resources for web developers and designers.">
  <meta name="generator" content="Joomla! - Open Source Content Management">
  <title>Home - Hot!Ajax Magazine</title>
  <link href="http://www.hotajax.org/favicon.ico" rel="shortcut icon" type="image/vnd.microsoft.icon">
  <link rel="stylesheet" href="/attachments_hide.css" type="text/css">
  <link rel="stylesheet" href="/attachments_list.css" type="text/css">
  <link rel="stylesheet" href="/shadowbox.css" type="text/css">
  <link rel="stylesheet" href="/css-72cd1022ad7e580e93c1acd1791620a1.css" type="text/css">
  <link rel="stylesheet" href="/css-57a73e29ca7cdbc6de62d094b245a77d.css" type="text/css">
  <link rel="stylesheet" href="/css-6f7b6356268c0466e046f486c047cce5.css" type="text/css">
  <link rel="stylesheet" href="/css-4d6a46c36924362b5c327e27af19b022.css" type="text/css">
  <link rel="stylesheet" href="/css-d5d4948a30967147f9d595ef4f92873b.css" type="text/css">
  <link rel="stylesheet" href="/finder.css" type="text/css">
  <link rel="stylesheet" href="/roknewspager.css" type="text/css">
  <style type="text/css">
#sb-body-inner{background-color:#fff;}
body {background:#C3D3E0;}
#rt-body-background, .roksearch-wrapper {background:#FFFFFF;}
#roksearch_results {background-color:#FFFFFF;}
.roksearch_odd:hover, .roksearch_even:hover {background:#FFFFFF !important;}
.box5, .title5 .title, #rokmicronews .micronews-list ul li.active a span {color:#FFFFFF;}
body, body a:hover, #rt-bottom {color:#444;}
body a {color:#005BB2;}
.title7 .module-title, #rokmicronews .micronews-headline {border-color:#444;}
#rt-header-surround3, #rt-logoblock, .box7, #rt-header .readon, #rt-navigation .readon, .readonstyle-button .box6 .readon, #newsflash .flashing {background-color:#173757;}
#rt-subnavigation {border-color:#173757;}
.title span {color:#173757;}
#rt-logoblock, #rt-logoblock a:hover, .box7, .box7 a:hover, #newsflash .flashing {color:#FFFFFF;}
#rt-logoblock a, .box7 a, .box7 .title span {color:#FFFFFF;}
#rt-header-surround2, #rt-header, #rt-navigation, #rt-footerbar3, #rt-top, .readonstyle-button .readon, .box6, .menutop .fusion-submenu-wrapper {background-color:#2C68A3;}
#rt-header, #rt-navigation, #rt-top, .readonstyle-button .readon, .readonstyle-button .readon .button, #rt-footer .readon, #rt-copyright .readon, .box6, .fusion-submenu-wrapper {color:#ffffff;}
#rt-header a, #rt-navigation a, #rt-top a, #rt-header .title span, #rt-navigation .title span, #rt-top .title span, .box6 a, .box6 .title span, #rt-subnavigation ul.menu li .item:hover, #rt-subnavigation ul.menu li.active .item, .menutop li .item, .fusion-submenu-wrapper a {color:#ffffff;}
#rt-subnavigation {background-color:#ECF0F5;}
#rt-subnavigation {color:#333333;}
#rt-subnavigation a {color:#005BB2;}
#rt-footerbar, .worldmap .location {background-color:#ECF0F5;}
#rt-footer, #rt-copyright, .rt-details-top {color:#666666;}
#rt-footer a, #rt-footer .item, #rt-copyright a {color:#005BB2;}
.roknewsflash {background:#FEF49C;}
.roknewsflash ul li a {color:#000;}
.featuretable-col-border .featuretable-cell, .featuretable-col-border .featuretable-head, .featuretable .featuretable-col.highlight .featuretable-cell {background-color:#FFFFFF;}
.roknewspager .roknewspager-title {border-color:#444;}
.readonstyle-button .cart_product_add .item_add span, .readonstyle-button .simpleCart_checkout span, .readonstyle-button .simpleCart_empty span {color:#ffffff;}
.cart_totals div {color:#444;}
.box1 #roktwittie .title, .box2 #roktwittie .title, .box3 #roktwittie .title, .box4 #roktwittie .title {color:#444;border-color:#444;}
.box5 #roktwittie .title {color:#FFFFFF;border-color:#FFFFFF;}
.box6 #roktwittie .title {color:#ffffff;border-color:#ffffff;}
.box7 #roktwittie .title {color:#FFFFFF;border-color:#FFFFFF;}
.box1 #rokweather .degrees .active, .box1 #rokweather .degrees, .box1 #rokweather .day span.low, .box1 #rokweather .day span.high, .box2 #rokweather .degrees .active, .box2 #rokweather .degrees, .box2 #rokweather .day span.low, .box2 #rokweather .day span.high, .box3 #rokweather .degrees .active, .box3 #rokweather .degrees, .box3 #rokweather .day span.low, .box3 #rokweather .day span.high, .box4 #rokweather .degrees .active, .box4 #rokweather .degrees, .box4 #rokweather .day span.low, .box4 #rokweather .day span.high {color:#444;border-color:#444;}
.box5 #rokweather .degrees .active, .box5 #rokweather .degrees, .box5 #rokweather .day span.low, .box5 #rokweather .day span.high {color:#FFFFFF;border-color:#FFFFFF;}
.box6 #rokweather .degrees .active, .box6 #rokweather .degrees, .box6 #rokweather .day span.low, .box6 #rokweather .day span.high {color:#ffffff;border-color:#ffffff;}
.box7 #rokweather .degrees .active, .box7 #rokweather .degrees, .box7 #rokweather .day span.low, .box7 #rokweather .day span.high {color:#FFFFFF;border-color:#FFFFFF;}

body #rt-logo {width:180px;height:105px;}
  </style>
  <script src="/mootools-core.js" type="text/javascript"></script>
  <script src="/core.js" type="text/javascript"></script>
  <script src="/caption.js" type="text/javascript"></script>
  <script src="/validate.js" type="text/javascript"></script>
  <script src="/mootools-more.js" type="text/javascript"></script>
  <script src="/attachments_refresh.js" type="text/javascript"></script>
  <script src="/shadowbox.js" type="text/javascript"></script>
  <script src="/js-6084f007659bd8573f33b2de83618222.js" type="text/javascript"></script>
  <script src="/autocompleter.js" type="text/javascript"></script>
  <script src="/roknewspager.js" type="text/javascript"></script>
  <script type="text/javascript">
window.addEvent('load', function() {
				new JCaption('img.caption');
			});
			Shadowbox.init({});
		
window.addEvent('domready', function() {new GantrySmartLoad({'offset': {'x': 200, 'y': 200}, 'placeholder': '/templates/rt_syndicate/images/blank.gif', 'exclusion': ['ul.menutop,div.roktabs-wrapper,span.image,div.fusion-submenu-wrapper,.module-content ul.menu .image,.roknewspager-div a,#rokintroscroller,.feature-block .image-full']}); });
		(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
		(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
		m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
		})(window,document,'script','//www.google-analytics.com/analytics.js','__gaTracker');
		__gaTracker('create', 'UA-8573595-1', 'auto');
		__gaTracker('send', 'pageview');
	
			window.addEvent('domready', function() {
				var modules = ['rt-block'];
				var header = ['h3','h2:not(.itemTitle)','h1'];
				GantryBuildSpans(modules, header);
			});
		
InputsExclusion.push('.content_vote','#rt-popup','#rt-popuplogin','#vmMainPage')

window.addEvent('domready', function() {
                new Fusion('ul.menutop', {
                    pill: 1,
                    effect: 'slide and fade',
                    opacity:  1,
                    hideDelay:  500,
                    centered:  0,
                    tweakInitial: {'x': -10, 'y': -11},
                    tweakSubsequent: {'x':  0, 'y':  0},
                    tweakSizes: {'width': 20, 'height': 20},
                    menuFx: {duration:  300, transition: Fx.Transitions.Quart.easeInOut},
                    pillFx: {duration:  200, transition: Fx.Transitions.Elastic.easeIn}
                });
            
});

function keepAlive() {	var myAjax = new Request({method: "get", url: "index.php"}).send();} window.addEvent("domready", function(){ keepAlive.periodical(840000); });
  </script>
<script src="/bsa.htm" async="" type="text/javascript"></script></head>
  <body class="bodylevel-high readonstyle-button font-family-syndicate font-size-is-default menu-type-fusionmenu col16 option-com-content menu-home "><div id="wm-ipp" style="display: block;" lang="en">

<div style="position:fixed;left:0;top:0;width:100%!important">
<div id="wm-ipp-inside">

</div>
</div>
</div>


    <div id="rt-page-background">
                    <div class="rt-container">
                    <div id="rt-logoblock" class="logo-overlay-light">
                  	<a href="http://www.hotajax.org/" id="rt-logo" class="logo-style-4"></a>
	    
          </div>
                    <div id="rt-navigation-surround">
                        <div id="rt-navigation" class="header-overlay-light">
              <div id="rt-navigation2" class="header-image-3">
                
<div class="rt-menubar">
    <ul class="menutop level1 ">
                        <li class="item106 active root">
                            <a id="a-1428121579194568" class="orphan item bullet" href="http://www.hotajax.org/">
                    <span>
                                        Home                                                            </span>
                </a>
            
                    </li>
                                <li class="item53 parent root f-main-parent">
                            <a id="a-1428121579195797" class="daddy item bullet" href="http://www.hotajax.org/tooltips.html">
                    <span>
                                        ToolTips                                                            <span class="daddyicon"></span>
                                        </span>
                </a>
            
                                                
                                    </li>
                                <li class="item54 parent root f-main-parent">
                            <a id="a-1428121579196594" class="daddy item bullet" href="http://www.hotajax.org/lightbox.html">
                    <span>
                                        Lightbox                                                            <span class="daddyicon"></span>
                                        </span>
                </a>
            
                                                
                                    </li>
                                <li class="item55 parent root f-main-parent">
                            <a id="a-1428121579198595" class="daddy item bullet" href="http://www.hotajax.org/popup.html">
                    <span>
                                        PopUp                                                            <span class="daddyicon"></span>
                                        </span>
                </a>
            
                                                
                                    </li>
                                <li class="item56 parent root f-main-parent">
                            <a id="a-1428121579199795" class="daddy item bullet" href="http://www.hotajax.org/slider-tabs.html">
                    <span>
                                        Slider | Tabs | Menu                                                            <span class="daddyicon"></span>
                                        </span>
                </a>
            
                                                
                                    </li>
                                <li class="item58 parent root f-main-parent">
                            <a id="a-1428121579200648" class="daddy item bullet" href="http://www.hotajax.org/images-gallery.html">
                    <span>
                                        Images | Gallery                                                            <span class="daddyicon"></span>
                                        </span>
                </a>
            
                                                
                                    </li>
                                <li class="item59 parent root f-main-parent">
                            <a id="a-14281215792013" class="daddy item bullet" href="http://www.hotajax.org/zoom.html">
                    <span>
                                        Zoom                                                            <span class="daddyicon"></span>
                                        </span>
                </a>
            
                                                
                                    </li>
                                <li class="item83 parent root f-main-parent">
                            <a id="a-1428121579202397" class="daddy item bullet" href="http://www.hotajax.org/form.html">
                    <span>
                                        Form                                                            <span class="daddyicon"></span>
                                        </span>
                </a>
            
                                                
                                    </li>
                                <li class="item87 parent root f-main-parent">
                            <a id="a-1428121579203810" class="daddy item bullet" href="http://www.hotajax.org/others.html">
                    <span>
                                        Others                                                            <span class="daddyicon"></span>
                                        </span>
                </a>
            
                                                
                                    </li>
                    </ul><div style="display: block; left: 6px; width: 54px; top: 0px;" class="fusion-pill-l"><div class="fusion-pill-r"></div></div>
</div>
              </div>
            </div>
                                  </div>
        </div>
                  <div class="rt-container">
        <div id="rt-body-background">
                    <div id="rt-drawer">
                          <div class="clear"></div>
          </div>
                    <div class="clear"></div>
          <div id="rt-body-surround" class="body-overlay-light">
                        
                        
                        
                                                                                    
				<div id="rt-main" class="mb8-sa4-sb4">
            <div class="rt-grid-8 ">
                               					<div class="rt-block">
					<div class="title7 details-layout2">
                    	<div id="rt-mainbody">
                    		<div class="component-content rt-joomla">
                        		<div class="rt-blog ">
	
	
		
								<div class="items-row cols-1 row-0">
				<div class="item column-1">
			
<div class="rt-article">
	<div class="rt-article-bg">
			<div class="module-title-surround"><div class="module-title">
	<h2 class="title">
					<a style="visibility: visible;" href="http://www.hotajax.org/images-gallery/jquery/168-animated-css3-photo-stack.html"><span>
			Animated</span> CSS3 Photo Stack</a>
			</h2>
		</div></div>
	
				<div class="rt-articleinfo">
			<div class="rt-articleinfo-text">
								<div class="rt-date-posted">
					Created on Tuesday, 26 February 2013 13:14				</div>
																<div class="rt-date-published">
					Published on Tuesday, 26 February 2013 13:23				</div>
												<div class="rt-author"> 
													
											Written by Mike Lee									</div>
					
								<div class="rt-hits">
					Hits: 8193				</div>
							</div>
		<div class="rt-article-icons">
		<ul class="actions">
									<li class="email-icon">
				<a href="http://www.hotajax.org/component/mailto/?tmpl=component&amp;template=rt_syndicate&amp;link=66850b28e52e6aab2d382e8ec920c6209a96e8b9" title="Email" onclick="window.open(this.href,'win2','width=400,height=350,menubar=yes,resizable=yes'); return false;"><img src="/emailButton.png" alt="Email"></a>			</li>
			
					</ul>
	</div>
			 </div>
		
		<div class="module-content">
	
	
	
	<p><img src="/Animated%2520CSS3%2520Photo%2520Stack.jpg" alt="" border="0" height="335" width="432"></p>
<p>Animated CSS3 photo stack is use all kinds of fancy effects to 
transition between a set of images. The effects are implemented purely 
using CSS3, which means that they run smoothly on modern browsers and 
mobile devices. We will also make the photo stack advance automatically,
 so you can use it as a slideshow.</p>
<div class="attachmentsContainer">

<div class="attachmentsList" id="attachmentsList_com_content_article_168">
<table>
<caption>Attachments:</caption>
<tbody>
<tr class="odd"><td class="at_filename"><a class="at_icon" href="http://www.hotajax.org/attachments/article/168/animated-css3-photo-stack.zip" title="Download this file (animated-css3-photo-stack.zip)"><img src="/zip.gif" alt="Download this file (animated-css3-photo-stack.zip)"></a><a class="at_url" href="http://www.hotajax.org/attachments/article/168/animated-css3-photo-stack.zip" title="Download this file (animated-css3-photo-stack.zip)">Animated CSS3 Photo Stack</a></td><td class="at_file_size">10 kB</td></tr>
</tbody></table>
</div>

</div>
			<p class="rt-readon-surround">
			<a href="http://www.hotajax.org/images-gallery/jquery/168-animated-css3-photo-stack.html" class="readon"><span>
				Read more: Animated CSS3 Photo Stack			</span></a>
		</p>
			</div>
				<dd class="rt-parent-category">
										Parent Category: <a href="http://www.hotajax.org/images-gallery.html">Images | Gallery</a>						</dd>
						<dd class="rt-category">
										Category: <a href="http://www.hotajax.org/images-gallery/jquery.html">jQuery</a>						</dd>
				
	</div>
</div>

<div class="item-separator"></div>
		</div>
							<span class="row-separator"></span>
			</div>
									<div class="items-row cols-1 row-1">
				<div class="item column-1">
			
<div class="rt-article">
	<div class="rt-article-bg">
			<div class="module-title-surround"><div class="module-title">
	<h2 class="title">
					<a style="visibility: visible;" href="http://www.hotajax.org/slider-tabs/jquery/167-threesixty-slider.html">
			Threesixty-slider</a>
			</h2>
		</div></div>
	
				<div class="rt-articleinfo">
			<div class="rt-articleinfo-text">
								<div class="rt-date-posted">
					Created on Monday, 25 February 2013 11:54				</div>
																<div class="rt-date-published">
					Published on Monday, 25 February 2013 11:54				</div>
												<div class="rt-author"> 
													
											Written by Mike Lee									</div>
					
								<div class="rt-hits">
					Hits: 3095				</div>
							</div>
		<div class="rt-article-icons">
		<ul class="actions">
									<li class="email-icon">
				<a href="http://www.hotajax.org/component/mailto/?tmpl=component&amp;template=rt_syndicate&amp;link=ce75ffbf8b1c76d7d24308650c816d63de87b5e0" title="Email" onclick="window.open(this.href,'win2','width=400,height=350,menubar=yes,resizable=yes'); return false;"><img src="/emailButton.png" alt="Email"></a>			</li>
			
					</ul>
	</div>
			 </div>
		
		<div class="module-content">
	
	
	
	<p><img src="/threesixty-slider.jpg" alt="" border="0"></p>
<p>Threesixty-slider is a jQuery 360 image slider plugin.</p>
<p>The plugin is full customizable with number of options provided. The 
plugin have the power to display images in any angle 360 degrees. This 
feature can be used successfully in many use cases e.g. on an e-commerce
 site to help customers look products in detail, from any angle they 
desire.</p>
<div class="attachmentsContainer">

<div class="attachmentsList" id="attachmentsList_com_content_article_167">
<table>
<caption>Attachments:</caption>
<tbody>
<tr class="odd"><td class="at_filename"><a class="at_icon" href="http://www.hotajax.org/attachments/article/167/threesixty-slider.zip" title="Download this file (threesixty-slider.zip)"><img src="/zip.gif" alt="Download this file (threesixty-slider.zip)"></a><a class="at_url" href="http://www.hotajax.org/attachments/article/167/threesixty-slider.zip" title="Download this file (threesixty-slider.zip)">Threesixty-slider</a></td><td class="at_file_size">4770 kB</td></tr>
</tbody></table>
</div>

</div>
			<p class="rt-readon-surround">
			<a href="http://www.hotajax.org/slider-tabs/jquery/167-threesixty-slider.html" class="readon"><span>
				Read more: Threesixty-slider			</span></a>
		</p>
			</div>
				<dd class="rt-parent-category">
										Parent Category: <a href="http://www.hotajax.org/slider-tabs.html">Slider | Tabs | Menu</a>						</dd>
						<dd class="rt-category">
										Category: <a href="http://www.hotajax.org/slider-tabs/jquery.html">jQuery</a>						</dd>
				
	</div>
</div>

<div class="item-separator"></div>
		</div>
							<span class="row-separator"></span>
			</div>
									<div class="items-row cols-1 row-2">
				<div class="item column-1">
			
<div class="rt-article">
	<div class="rt-article-bg">
			<div class="module-title-surround"><div class="module-title">
	<h2 class="title">
					<a style="visibility: visible;" href="http://www.hotajax.org/others/163-milkchart.html">
			MilkChart</a>
			</h2>
		</div></div>
	
				<div class="rt-articleinfo">
			<div class="rt-articleinfo-text">
								<div class="rt-date-posted">
					Created on Monday, 04 February 2013 14:49				</div>
																<div class="rt-date-published">
					Published on Monday, 04 February 2013 14:49				</div>
									
								<div class="rt-hits">
					Hits: 2978				</div>
							</div>
		<div class="rt-article-icons">
		<ul class="actions">
									<li class="email-icon">
				<a href="http://www.hotajax.org/component/mailto/?tmpl=component&amp;template=rt_syndicate&amp;link=ad58a4c3de3eddcd0a784148dc699e3f1020d663" title="Email" onclick="window.open(this.href,'win2','width=400,height=350,menubar=yes,resizable=yes'); return false;"><img src="/emailButton.png" alt="Email"></a>			</li>
			
					</ul>
	</div>
			 </div>
		
		<div class="module-content">
	
	
	
	<p><img src="/milkchart.jpg" alt="" border="0" height="219" width="359"></p>
<p>To transform a table of data into a chart, simply create a MilkChart 
object of the chart type you wish passing in the table id and an object 
containing options for the chart.</p>
<div class="attachmentsContainer">

<div class="attachmentsList" id="attachmentsList_com_content_article_163">
<table>
<caption>Attachments:</caption>
<tbody>
<tr class="odd"><td class="at_filename"><a class="at_icon" href="http://www.hotajax.org/attachments/article/163/MilkChart.zip" title="Download this file (MilkChart.zip)"><img src="/zip.gif" alt="Download this file (MilkChart.zip)"></a><a class="at_url" href="http://www.hotajax.org/attachments/article/163/MilkChart.zip" title="Download this file (MilkChart.zip)">MilkChart.zip</a></td><td class="at_file_size">61 kB</td></tr>
</tbody></table>
</div>

</div>
			<p class="rt-readon-surround">
			<a href="http://www.hotajax.org/others/163-milkchart.html" class="readon"><span>
				Read more: MilkChart			</span></a>
		</p>
			</div>
						<dd class="rt-category">
										Category: <a href="http://www.hotajax.org/others.html">Others</a>						</dd>
				
	</div>
</div>

<div class="item-separator"></div>
		</div>
							<span class="row-separator"></span>
			</div>
									<div class="items-row cols-1 row-3">
				<div class="item column-1">
			
<div class="rt-article">
	<div class="rt-article-bg">
			<div class="module-title-surround"><div class="module-title">
	<h2 class="title">
					<a style="visibility: visible;" href="http://www.hotajax.org/others/162-mif-tree.html"><span>
			Mif</span> Tree</a>
			</h2>
		</div></div>
	
				<div class="rt-articleinfo">
			<div class="rt-articleinfo-text">
								<div class="rt-date-posted">
					Created on Thursday, 31 January 2013 12:26				</div>
																<div class="rt-date-published">
					Published on Thursday, 31 January 2013 12:29				</div>
									
								<div class="rt-hits">
					Hits: 1988				</div>
							</div>
		<div class="rt-article-icons">
		<ul class="actions">
									<li class="email-icon">
				<a href="http://www.hotajax.org/component/mailto/?tmpl=component&amp;template=rt_syndicate&amp;link=43d9da6e32af3a99590cc5ac92426e8c08e61949" title="Email" onclick="window.open(this.href,'win2','width=400,height=350,menubar=yes,resizable=yes'); return false;"><img src="/emailButton.png" alt="Email"></a>			</li>
			
					</ul>
	</div>
			 </div>
		
		<div class="module-content">
	
	
	
	<p><img src="/Mif%2520Tree.jpg" alt="" border="0"></p>
<p>The most famouse mootools tree for web applications.</p>
<p>&nbsp;</p>
<div class="attachmentsContainer">

<div class="attachmentsList" id="attachmentsList_com_content_article_162">
<table>
<caption>Attachments:</caption>
<tbody>
<tr class="odd"><td class="at_filename"><a class="at_icon" href="http://www.hotajax.org/attachments/article/162/miftree-1.2.zip" title="Download this file (miftree-1.2.zip)"><img src="/zip.gif" alt="Download this file (miftree-1.2.zip)"></a><a class="at_url" href="http://www.hotajax.org/attachments/article/162/miftree-1.2.zip" title="Download this file (miftree-1.2.zip)">miftree-1.2.zip</a></td><td class="at_file_size">222 kB</td></tr>
</tbody></table>
</div>

</div>
			<p class="rt-readon-surround">
			<a href="http://www.hotajax.org/others/162-mif-tree.html" class="readon"><span>
				Read more: Mif Tree			</span></a>
		</p>
			</div>
						<dd class="rt-category">
										Category: <a href="http://www.hotajax.org/others.html">Others</a>						</dd>
				
	</div>
</div>

<div class="item-separator"></div>
		</div>
							<span class="row-separator"></span>
			</div>
						
	
		<div class="rt-pagination">
				<p class="rt-results">
			Page 1 of 28		</p>
				<ul><li class="pagination-start"><span class="pagenav">Start</span></li><li class="pagination-prev"><span class="pagenav">Prev</span></li><li><span class="pagenav">1</span></li><li><a title="2" href="http://www.hotajax.org/?start=4" class="pagenav">2</a></li><li><a title="3" href="http://www.hotajax.org/?start=8" class="pagenav">3</a></li><li><a title="4" href="http://www.hotajax.org/?start=12" class="pagenav">4</a></li><li><a title="5" href="http://www.hotajax.org/?start=16" class="pagenav">5</a></li><li><a title="6" href="http://www.hotajax.org/?start=20" class="pagenav">6</a></li><li><a title="7" href="http://www.hotajax.org/?start=24" class="pagenav">7</a></li><li><a title="8" href="http://www.hotajax.org/?start=28" class="pagenav">8</a></li><li><a title="9" href="http://www.hotajax.org/?start=32" class="pagenav">9</a></li><li><a title="10" href="http://www.hotajax.org/?start=36" class="pagenav">10</a></li><li class="pagination-next"><a title="Next" href="http://www.hotajax.org/?start=4" class="pagenav">Next</a></li><li class="pagination-end"><a title="End" href="http://www.hotajax.org/?start=108" class="pagenav">End</a></li></ul>	</div>
	
</div>
                        	</div>
                        </div>
						<div class="clear"></div>
					</div>
				</div>
                				
                			</div>
                        <div class="rt-grid-4 ">
                <div id="rt-sidebar-b">
                                    <div class="box2">
                    <div class="rt-block">
								<div class="module-title"><h2 style="visibility: visible;" class="title">Search</h2></div>
                				<div class="rt-module-inner">
					<div class="module-content">
	                	
<script type="text/javascript">
//<![CDATA[
	window.addEvent('domready', function() {
		var value;

		// Set the input value if not already set.
		if (!document.id('mod-finder-searchword').getProperty('value')) {
			document.id('mod-finder-searchword').setProperty('value', 'Search...');
		}

		// Get the current value.
		value = document.id('mod-finder-searchword').getProperty('value');

		// If the current value equals the default value, clear it.
		document.id('mod-finder-searchword').addEvent('focus', function() {
			if (this.getProperty('value') == 'Search...') {
				this.setProperty('value', '');
			}
		});

		// If the current value is empty, set the previous value.
		document.id('mod-finder-searchword').addEvent('blur', function() {
			if (!this.getProperty('value')) {
				this.setProperty('value', value);
			}
		});

		document.id('mod-finder-searchform').addEvent('submit', function(e){
			e = new Event(e);
			e.stop();

			// Disable select boxes with no value selected.
			if (document.id('mod-finder-advanced') != null) {
				document.id('mod-finder-advanced').getElements('select').each(function(s){
					if (!s.getProperty('value')) {
						s.setProperty('disabled', 'disabled');
					}
				});
			}

			document.id('mod-finder-searchform').submit();
		});

		/*
		 * This segment of code sets up the autocompleter.
		 */
								var url = '/component/finder/?task=suggestions.display&format=json&tmpl=component';
			var ModCompleter = new Autocompleter.Request.JSON(document.id('mod-finder-searchword'), url, {'postVar': 'q'});
			});
//]]>
</script>

<form id="mod-finder-searchform" action="http://www.hotajax.org/component/finder/search.html" method="get">
	<div class="finderbox2">
		<input autocomplete="off" name="q" id="mod-finder-searchword" class="inputbox" size="25" value="Search..." type="text"><br><button class="buttonbox2 finderbox2" type="submit">Go</button>
				<input name="Itemid" value="106" type="hidden">	</div>
</form>
						<div class="clear"></div>
					</div>
				</div>
            </div>
                </div>
		                <div class="box2">
                    <div class="rt-block">
								<div class="module-title"><h2 style="visibility: visible;" class="title"><span>Latest</span> News</h2></div>
                				<div class="rt-module-inner">
					<div class="module-content">
	                	
<div style="overflow: hidden;" class="roknewspager-wrapper">
    <div style="opacity: 1; display: none; position: absolute; top: 0px; left: 0px;" class="roknewspager-overlay"></div><div class="roknewspager">
                        <div class="roknewspager-li active">
            <h3 class="roknewspager-h3">
                <a style="visibility: visible;" href="http://www.hotajax.org/images-gallery/jquery/168-animated-css3-photo-stack.html" class="roknewspager-title"><span>Animated</span> CSS3 Photo Stack</a>
                <span class="roknewspager-toggle roknewspager-toggle-active"></span>
            </h3>

            <div style="padding-top: 0px; border-top: medium none; padding-bottom: 0px; border-bottom: medium none; overflow: hidden; height: auto;" class="roknewspager-div">
                <div class="roknewspager-content">
                                        <a href="http://www.hotajax.org/images-gallery/jquery/168-animated-css3-photo-stack.html">                     <img src="/Animated%2520CSS3%2520Photo%2520Stack_thumb.jpg" alt="Animated CSS3 Photo Stack">
                    </a>                                                                                 <div class="introtext">
Animated CSS3 photo stack is use all kinds of fancy effects to 
transition between a set of images. The effects are implemented purely 
using CSS3, which means that they run smoothly on modern browsers...</div>                                                                                                    <a href="http://www.hotajax.org/images-gallery/jquery/168-animated-css3-photo-stack.html" class="readon"><span>Read More...</span></a>                </div>
            </div>
        </div>
                        <div class="roknewspager-li">
            <h3 class="roknewspager-h3">
                <a style="visibility: visible;" href="http://www.hotajax.org/slider-tabs/jquery/167-threesixty-slider.html" class="roknewspager-title"><span>Threesixty-slider</span></a>
                <span class="roknewspager-toggle"></span>
            </h3>

            <div style="padding-top: 0px; border-top: medium none; padding-bottom: 0px; border-bottom: medium none; overflow: hidden; height: 0px;" class="roknewspager-div">
                <div class="roknewspager-content">
                                        <a href="http://www.hotajax.org/slider-tabs/jquery/167-threesixty-slider.html">                     <img src="/threesixty-slider_thumb.jpg" alt="Threesixty-slider">
                    </a>                                                                                 <div class="introtext">
Threesixty-slider is a jQuery 360 image slider plugin.
The plugin is full customizable with number of options provided. The 
plugin have the power to display images in any angle 360 degrees. This 
feature...</div>                                                                                                    <a href="http://www.hotajax.org/slider-tabs/jquery/167-threesixty-slider.html" class="readon"><span>Read More...</span></a>                </div>
            </div>
        </div>
                        <div class="roknewspager-li">
            <h3 class="roknewspager-h3">
                <a style="visibility: visible;" href="http://www.hotajax.org/others/d3js/166-d3-js-a-data-driven-documents.html" class="roknewspager-title"><span>D3.js</span> a Data-Driven Documents</a>
                <span class="roknewspager-toggle"></span>
            </h3>

            <div style="padding-top: 0px; border-top: medium none; padding-bottom: 0px; border-bottom: medium none; overflow: hidden; height: 0px;" class="roknewspager-div">
                <div class="roknewspager-content">
                                        <a href="http://www.hotajax.org/others/d3js/166-d3-js-a-data-driven-documents.html">                     <img src="/D3js_thumb.jpg" alt="D3.js a Data-Driven Documents">
                    </a>                                                                                 <div class="introtext">
D3.js is a JavaScript library for manipulating documents based on data. 
D3 helps you bring data to life using HTML, SVG and CSS. D3�s emphasis 
on web standards gives you the full capabilities of modern...</div>                                                                                                    <a href="http://www.hotajax.org/others/d3js/166-d3-js-a-data-driven-documents.html" class="readon"><span>Read More...</span></a>                </div>
            </div>
        </div>
                        <div class="roknewspager-li">
            <h3 class="roknewspager-h3">
                <a style="visibility: visible;" href="http://www.hotajax.org/others/threejs/165-three-js-a-awesome-3d-engine.html" class="roknewspager-title"><span>Three.js</span> A awesome 3D Engine</a>
                <span class="roknewspager-toggle"></span>
            </h3>

            <div style="padding-top: 0px; border-top: medium none; padding-bottom: 0px; border-bottom: medium none; overflow: hidden; height: 0px;" class="roknewspager-div">
                <div class="roknewspager-content">
                                        <a href="http://www.hotajax.org/others/threejs/165-three-js-a-awesome-3d-engine.html">                     <img src="/threejs_thumb.jpg" alt="Three.js A awesome 3D Engine">
                    </a>                                                                                 <div class="introtext">
Three.js is a library that makes WebGL - 3D in the browser - very easy. 
While a simple cube in raw WebGL would turn out hundreds of lines of 
Javascript and shader code, a Three.js equivalent is only...</div>                                                                                                    <a href="http://www.hotajax.org/others/threejs/165-three-js-a-awesome-3d-engine.html" class="readon"><span>Read More...</span></a>                </div>
            </div>
        </div>
                        <div class="roknewspager-li">
            <h3 class="roknewspager-h3">
                <a style="visibility: visible;" href="http://www.hotajax.org/others/163-milkchart.html" class="roknewspager-title"><span>MilkChart</span></a>
                <span class="roknewspager-toggle"></span>
            </h3>

            <div style="padding-top: 0px; border-top: medium none; padding-bottom: 0px; border-bottom: medium none; overflow: hidden; height: 0px;" class="roknewspager-div">
                <div class="roknewspager-content">
                                        <a href="http://www.hotajax.org/others/163-milkchart.html">                     <img src="/milkchart_thumb.jpg" alt="MilkChart">
                    </a>                                                                                 <div class="introtext">
To transform a table of data into a chart, simply create a MilkChart 
object of the chart type you wish passing in the table id and an object 
containing options for the chart.
</div>                                                                                                    <a href="http://www.hotajax.org/others/163-milkchart.html" class="readon"><span>Read More...</span></a>                </div>
            </div>
        </div>
            </div>
</div>
<div class="roknewspager-pages">
    <div class="roknewspager-spinner"></div>
    <div class="roknewspager-pages2">
        <div class="roknewspager-prev"></div>
        <div class="roknewspager-next-disabled"></div>
        <ul class="roknewspager-numbers">
                        <li class="active">1</li>
                    </ul>
    </div>
</div>
<script type="text/javascript">
    RokNewsPagerStorage.push({
        'url':'/component/rokmodule/?tmpl=component&amp;type=raw&amp;moduleid=124&amp;offset=_OFFSET_',
        'autoupdate': 1,
        'delay': 5000,
        'accordion':true
    });
</script>						<div class="clear"></div>
					</div>
				</div>
            </div>
                </div>
		                <div class="box2">
                    <div class="rt-block">
								<div class="module-title"><h2 style="visibility: visible;" class="title"><span>Blogging</span></h2></div>
                				<div class="rt-module-inner">
					<div class="module-content">
	                	
			<p>Looking to start your own blog?  WordPress is the most robust platform, but there is a learning curve.  Because of that, we recommend you read this <a href="https://www.theblogstarter.com">tutorial about blogging</a> from Scott Chow, which will help with installing and customizing a WordPress blog.</p>

						<div class="clear"></div>
					</div>
				</div>
            </div>
                </div>
		                <div class="box2">
                    <div class="rt-block">
								<div class="module-title"><h2 style="visibility: visible;" class="title"><span>Latest</span> Users</h2></div>
                				<div class="rt-module-inner">
					<div class="module-content">
	                		<ul class="latestusersbox2">
			<li>
			Alexandertak		</li>
			<li>
			Carpsyday		</li>
			<li>
			acrotolla		</li>
			<li>
			clarezn1		</li>
			<li>
			tosyacantiect		</li>
		</ul>
						<div class="clear"></div>
					</div>
				</div>
            </div>
                </div>
		
                </div>
            </div>

            <div class="rt-grid-4 ">
                <div id="rt-sidebar-c">
                                    <div class="box6 title6">
                    <div class="rt-block">
								<div class="module-title"><h2 style="visibility: visible;" class="title">Menu</h2></div>
                				<div class="rt-module-inner">
					<div class="module-content">
	                	
<ul class="menu-nav">
<li id="item-172"><a href="http://www.hotajax.org/write-to-us.html"><span>Write to us?</span></a></li><li id="item-173"><a href="http://www.hotajax.org/contact.html"><span>Contact</span></a></li><li id="item-174"><a href="http://www.hotajax.org/about.html"><span>About</span></a></li><li id="item-90" class="deeper parent"><a href="http://www.hotajax.org/jquery.html"><span>jQuery</span></a><ul><li id="item-91"><a href="http://www.hotajax.org/jquery/form.html"><span>Form</span></a></li><li id="item-92"><a href="http://www.hotajax.org/jquery/images--gallery.html"><span>Images | Gallery</span></a></li><li id="item-93"><a href="http://www.hotajax.org/jquery/lightbox.html"><span>Lightbox</span></a></li><li id="item-94"><a href="http://www.hotajax.org/jquery/popup.html"><span>PopUp</span></a></li><li id="item-95"><a href="http://www.hotajax.org/jquery/slider-tabs-menu.html"><span>Slider | Tabs | Menu</span></a></li><li id="item-96"><a href="http://www.hotajax.org/jquery/tooltips.html"><span>ToolTips</span></a></li><li id="item-202"><a href="http://www.hotajax.org/jquery/zoom.html"><span>Zoom</span></a></li></ul></li><li id="item-98" class="deeper parent"><a href="http://www.hotajax.org/mootools.html"><span>MooTools</span></a><ul><li id="item-99"><a href="http://www.hotajax.org/mootools/form.html"><span>Form</span></a></li><li id="item-100"><a href="http://www.hotajax.org/mootools/images-gallery.html"><span>Images | Gallery</span></a></li><li id="item-101"><a href="http://www.hotajax.org/mootools/lightbox.html"><span>Lightbox</span></a></li><li id="item-102"><a href="http://www.hotajax.org/mootools/popup.html"><span>PopUp</span></a></li><li id="item-103"><a href="http://www.hotajax.org/mootools/slider-tabs-menu.html"><span>Slider | Tabs | Menu</span></a></li><li id="item-104"><a href="http://www.hotajax.org/mootools/tooltips.html"><span>ToolTips</span></a></li><li id="item-105"><a href="http://www.hotajax.org/mootools/zoom.html"><span>Zoom</span></a></li></ul></li></ul>						<div class="clear"></div>
					</div>
				</div>
            </div>
                </div>
		                <div class="box2 title1">
                    <div class="rt-block">
								<div class="rt-module-inner">
					<div class="module-content">
	                	<form action="http://www.hotajax.org/" method="post" name="form-login" id="form-login">
		<fieldset class="userdata">
	<p id="form-login-username">
		<label for="modlgn-username">User Name</label><br>
		<input id="modlgn-username" name="username" class="inputbox" size="18" type="text">
	</p>
	<p id="form-login-password">
		<label for="modlgn-passwd">Password</label><br>
		<input id="modlgn-passwd" name="password" class="inputbox" size="18" type="password">
	</p>
		<p id="form-login-remember">
		<input style="position: absolute; left: -10000px;" id="modlgn-remember" name="remember" class="checkbox" value="yes" type="checkbox">
		<label class="rokchecks rokremember" for="modlgn-remember">Remember Me</label>
	</p>
		<div class="readon"><input name="Submit" class="button" value="Log in" type="submit"></div>
	<input name="option" value="com_users" type="hidden">
	<input name="task" value="user.login" type="hidden">
	<input name="return" value="aW5kZXgucGhwP0l0ZW1pZD0xMDY=" type="hidden">
	<input name="3a6de73d9ed9705408320405c8ee584a" value="1" type="hidden">	</fieldset>
	<ul>
		<li>
			<a href="http://www.hotajax.org/component/users/?view=reset">
			Forgot your password?</a>
		</li>
		<li>
			<a href="http://www.hotajax.org/component/users/?view=remind">
			Forgot your username?</a>
		</li>
				<li>
			<a href="http://www.hotajax.org/component/users/?view=registration">
				Create an account</a>
		</li>
			</ul>
	</form>
						<div class="clear"></div>
					</div>
				</div>
            </div>
                </div>
		
                </div>
            </div>

            <div class="clear"></div>
        </div>
		                                                          </div>
        </div>
      </div>
            <div class="rt-container">
                      <div id="rt-footerbar" class="footer-overlay-light">
          <div id="rt-footerbar2"></div>
            <div id="rt-footerbar-overlay">
                                          <div id="rt-copyright">
                                  <div class="rt-grid-16 rt-alpha rt-omega">
    		<div class="clear"></div>
		<span class="copytext">Hot!Ajax Magazine 2008-2013</span>
		
		<div id="rt-block-totop">
			<a style="outline: medium none;" href="#" id="gantry-totop"><span class="totop-desc">Top</span></a>
		</div>
		
</div>
                  <div class="clear"></div>
                              </div>
                          </div>
          <div id="rt-footerbar3"></div>
        </div>
                            </div>
          </div>
                    <!-- BuySellAds Ad Code -->
<script type="text/javascript">
(function(){
  var bsa = document.createElement('script');
     bsa.type = 'text/javascript';
     bsa.async = true;
     bsa.src = 'http://s3.buysellads.com/ac/bsa.js';
  (document.getElementsByTagName('head')[0]||document.getElementsByTagName('body')[0]).appendChild(bsa);
})();
</script>
<!-- End BuySellAds Ad Code -->
 







<div class="fusion-js-container level1 menutop"><div class="fusion-js-subs"><div class="fusion-submenu-wrapper level2" style="width: 180px; margin-top: 0px;">
                        
                        <ul class="level2" style="width:180px;">
                                                                                                        <li class="item75 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579196647" class="orphan item bullet" href="http://www.hotajax.org/tooltips/jquery.html">
                    <span>
                                        jQuery                                                            </span>
                </a>
            
                    </li>
                                                                        
                                                                        <li class="item76 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579196329" class="orphan item bullet" href="http://www.hotajax.org/tooltips/mootools.html">
                    <span>
                                        MooTools                                                            </span>
                </a>
            
                    </li>
                                                                        
                                                                        <li class="item77 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579196229" class="orphan item bullet" href="http://www.hotajax.org/tooltips/others.html">
                    <span>
                                        Others                                                            </span>
                </a>
            
                    </li>
                                                                                            </ul>

                                                <div class="drop-bot"></div>
                    </div></div><div class="fusion-js-subs"><div class="fusion-submenu-wrapper level2" style="width: 180px; margin-top: 0px;">
                        
                        <ul class="level2" style="width:180px;">
                                                                                                        <li class="item66 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579197346" class="orphan item bullet" href="http://www.hotajax.org/lightbox/jquery.html">
                    <span>
                                        jQuery                                                            </span>
                </a>
            
                    </li>
                                                                        
                                                                        <li class="item67 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579197467" class="orphan item bullet" href="http://www.hotajax.org/lightbox/mootools.html">
                    <span>
                                        MooTools                                                            </span>
                </a>
            
                    </li>
                                                                        
                                                                        <li class="item68 f-submenu-item">
                            <a tabindex="-1" id="a-142812157919730" class="orphan item bullet" href="http://www.hotajax.org/lightbox/others.html">
                    <span>
                                        Others                                                            </span>
                </a>
            
                    </li>
                                                                                            </ul>

                                                <div class="drop-bot"></div>
                    </div></div><div class="fusion-js-subs"><div class="fusion-submenu-wrapper level2" style="width: 180px; margin-top: 0px;">
                        
                        <ul class="level2" style="width:180px;">
                                                                                                        <li class="item69 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579198743" class="orphan item bullet" href="http://www.hotajax.org/popup/jquery.html">
                    <span>
                                        jQuery                                                            </span>
                </a>
            
                    </li>
                                                                        
                                                                        <li class="item70 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579198673" class="orphan item bullet" href="http://www.hotajax.org/popup/mootools.html">
                    <span>
                                        MooTools                                                            </span>
                </a>
            
                    </li>
                                                                        
                                                                        <li class="item71 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579199894" class="orphan item bullet" href="http://www.hotajax.org/popup/others.html">
                    <span>
                                        Others                                                            </span>
                </a>
            
                    </li>
                                                                                            </ul>

                                                <div class="drop-bot"></div>
                    </div></div><div class="fusion-js-subs"><div class="fusion-submenu-wrapper level2" style="width: 180px; margin-top: 0px;">
                        
                        <ul class="level2" style="width:180px;">
                                                                                                        <li class="item72 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579199896" class="orphan item bullet" href="http://www.hotajax.org/slider-tabs/jquery.html">
                    <span>
                                        jQuery                                                            </span>
                </a>
            
                    </li>
                                                                        
                                                                        <li class="item73 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579200640" class="orphan item bullet" href="http://www.hotajax.org/slider-tabs/mootools.html">
                    <span>
                                        MooTools                                                            </span>
                </a>
            
                    </li>
                                                                        
                                                                        <li class="item74 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579200613" class="orphan item bullet" href="http://www.hotajax.org/slider-tabs/others.html">
                    <span>
                                        Others                                                            </span>
                </a>
            
                    </li>
                                                                                            </ul>

                                                <div class="drop-bot"></div>
                    </div></div><div class="fusion-js-subs"><div class="fusion-submenu-wrapper level2" style="width: 180px; margin-top: 0px;">
                        
                        <ul class="level2" style="width:180px;">
                                                                                                        <li class="item60 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579201548" class="orphan item bullet" href="http://www.hotajax.org/images-gallery/jquery.html">
                    <span>
                                        jQuery                                                            </span>
                </a>
            
                    </li>
                                                                        
                                                                        <li class="item61 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579201117" class="orphan item bullet" href="http://www.hotajax.org/images-gallery/mootools.html">
                    <span>
                                        MooTools                                                            </span>
                </a>
            
                    </li>
                                                                        
                                                                        <li class="item62 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579201322" class="orphan item bullet" href="http://www.hotajax.org/images-gallery/others.html">
                    <span>
                                        Others                                                            </span>
                </a>
            
                    </li>
                                                                                            </ul>

                                                <div class="drop-bot"></div>
                    </div></div><div class="fusion-js-subs"><div class="fusion-submenu-wrapper level2" style="width: 180px; margin-top: 0px;">
                        
                        <ul class="level2" style="width:180px;">
                                                                                                        <li class="item78 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579202258" class="orphan item bullet" href="http://www.hotajax.org/zoom/jquery.html">
                    <span>
                                        jQuery                                                            </span>
                </a>
            
                    </li>
                                                                        
                                                                        <li class="item79 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579202776" class="orphan item bullet" href="http://www.hotajax.org/zoom/mootools.html">
                    <span>
                                        MooTools                                                            </span>
                </a>
            
                    </li>
                                                                        
                                                                        <li class="item80 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579202228" class="orphan item bullet" href="http://www.hotajax.org/zoom/others.html">
                    <span>
                                        Others                                                            </span>
                </a>
            
                    </li>
                                                                                            </ul>

                                                <div class="drop-bot"></div>
                    </div></div><div class="fusion-js-subs"><div class="fusion-submenu-wrapper level2" style="width: 180px; margin-top: 0px;">
                        
                        <ul class="level2" style="width:180px;">
                                                                                                        <li class="item84 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579203712" class="orphan item bullet" href="http://www.hotajax.org/form/jquery.html">
                    <span>
                                        jQuery                                                            </span>
                </a>
            
                    </li>
                                                                        
                                                                        <li class="item85 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579203175" class="orphan item bullet" href="http://www.hotajax.org/form/mootools.html">
                    <span>
                                        MooTools                                                            </span>
                </a>
            
                    </li>
                                                                        
                                                                        <li class="item86 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579203496" class="orphan item bullet" href="http://www.hotajax.org/form/others.html">
                    <span>
                                        Others                                                            </span>
                </a>
            
                    </li>
                                                                                            </ul>

                                                <div class="drop-bot"></div>
                    </div></div><div class="fusion-js-subs"><div class="fusion-submenu-wrapper level2" style="width: 180px; margin-top: 0px;">
                        
                        <ul class="level2" style="width:180px;">
                                                                                                        <li class="item88 f-submenu-item">
                            <a tabindex="-1" id="a-142812157920476" class="orphan item bullet" href="http://www.hotajax.org/others/raphaeljs.html">
                    <span>
                                        Raphael.js                                                            </span>
                </a>
            
                    </li>
                                                                        
                                                                        <li class="item232 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579204580" class="orphan item bullet" href="http://www.hotajax.org/others/threejs.html">
                    <span>
                                        Three.js                                                            </span>
                </a>
            
                    </li>
                                                                        
                                                                        <li class="item233 f-submenu-item">
                            <a tabindex="-1" id="a-1428121579204125" class="orphan item bullet" href="http://www.hotajax.org/others/d3js.html">
                    <span>
                                        D3.js                                                            </span>
                </a>
            
                    </li>
                                                                                            </ul>

                                                <div class="drop-bot"></div>
                    </div></div></div><ul style="z-index: 1000; opacity: 0;" class="autocompleter-choices"></ul><div id="sb-container"><div id="sb-overlay"></div><div id="sb-wrapper"><div id="sb-title"><div id="sb-title-inner"></div></div><div id="sb-wrapper-inner"><div id="sb-body"><div id="sb-body-inner"></div><div id="sb-loading"><div id="sb-loading-inner"><span>loading</span></div></div></div></div><div id="sb-info"><div id="sb-info-inner"><div id="sb-counter"></div><div id="sb-nav"><a id="sb-nav-close" title="Close" onclick="Shadowbox.close()"></a><a id="sb-nav-next" title="Next" onclick="Shadowbox.next()"></a><a id="sb-nav-play" title="Play" onclick="Shadowbox.play()"></a><a id="sb-nav-pause" title="Pause" onclick="Shadowbox.pause()"></a><a id="sb-nav-previous" title="Previous" onclick="Shadowbox.previous()"></a></div></div></div></div></div></body></html>
<!--
     FILE ARCHIVED ON 19:36:13 Mar 27, 2014 AND RETRIEVED FROM THE
     INTERNET ARCHIVE ON 4:26:12 Apr 4, 2015.
     JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE.

     ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C.
     SECTION 108(a)(3)).
-->