Author: Renato Formato.
<ul id="g1"> <li> <img src="http://www.htmldrive.net/edit_media/2010/201010/20101009/class.noobSlide/img1.jpg" /> </li> <li> <img src="http://www.htmldrive.net/edit_media/2010/201010/20101009/class.noobSlide/img2.jpg" /> </li> <li> <img src="http://www.htmldrive.net/edit_media/2010/201008/20100825/a.slideshow/docs/img/image_0.jpg" /> </li> <li> <img src="http://www.htmldrive.net/edit_media/2010/201008/20100817/image_gallery/images/lotus.jpg" /> </li> <li> <img src="http://www.htmldrive.net/edit_media/2010/201008/20100822/jReelGallery/images/thumbnap.jpg" /> </li> <li> <img src="http://www.htmldrive.net/edit_media/2010/201010/20101009/class.noobSlide/img6.jpg" /> </li> </ul>
Flip gallery with:
$("#g1").jFlip(300,300,{background:"green",cornersTop:false}). bind("flip.jflip",function(event,index,total){ $("#l1").html("Image "+(index+1)+" of "+total); });
Flip gallery with:
$("#g2").jFlip(300,300,{background:"green",cornersTop:true,scale:"fit"});
Flip gallery with:
$("#g3").jFlip(300,300,{background:"green",cornersTop:true,scale:"fill"});