Hellow, today i will presnt you a very cool gallery, is it a stack images wich click prev button apear a image of back and when click next button first image go back of stack. The css file i put in to a zip file for download, because thedeveloper of this gallery used a framework for css.

 

         

In the html page, in the head tag insert the code wich links the css and jQuery file with html file:

<link rel="stylesheet" type="text/css" media="screen" href="css/reset.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/960.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/main.css" />
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/demo.js"></script>

In the body tag copy the code:

 <div class="grid_6 prefix_1 suffix_1" id="gallery">
          <div id="pictures">
            <img src="images/picture1.png" alt="" />
            <img src="images/picture2.png" alt="" />
            <img src="images/picture3.png" alt="" />
            <img src="images/picture4.png" alt="" />
            <img src="images/picture5.png" alt="" />
          </div>
         
           <div class="grid_3 alpha" id="prev">
         <a href="#previous">« Previous Picture</a>
         </div>
         <div class="grid_3 omega" id="next">
         <a href="#next">Next Picture »</a>
     </div>
</div>

The last step is to download the css and the jQuery plugin, that was all, bye!

This script has been developed by http://usejquery.com !