Loading images sequentially



DEMO
DOWNLOAD

Compatibility: IE6+, Firefox2+, Opera, Chrome, Safari

1. Include nessesary .js files:

Include the jQuery library and the ujiThuml-plugin inside the <head> tag of the page.

<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.ujiThumb.js" type="text/javascript"></script>

2. Create thumb images:

<ul class="thum">
	<li><img src="img1.jpg" /></li>
	<li><img src="img2.jpg" /></li>
	<li><img src="img3.jpg" /></li>
	<li><img src="img4.jpg" /></li>
	<li><img src="img5.jpg" /></li>
	<li><img src="img6.jpg" /></li>
	<li><img src="img7.jpg" /></li>
	<li><img src="img8.jpg" /></li>
	<li><img src="img9.jpg" /></li>
	<li><img src="img10.jpg" /></li>
<ul>

3. Use the plugin:

 <script type="text/javascript">  
     $(function()
	{
		$('.thum').UjiThum(
			{
				 _delay :  80,
				_loader : 'img/loader.gif'
			}
		);
		
	});
</script>