<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>1stwebdesigner - Graphic and Web Design Blog &#187; lightbox</title>
	<atom:link href="http://www.1stwebdesigner.com/tag/lightbox/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.1stwebdesigner.com</link>
	<description>1stwebdesigner is a design blog dedicated to bloggers, freelancers, web-developers and designers. Topics focus on web design and inspirational articles.</description>
	<lastBuildDate>Sun, 12 Feb 2012 13:09:13 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>30 Awesome Ajax Lightbox and Modal Dialog Solutions</title>
		<link>http://www.1stwebdesigner.com/freebies/ajax-lightbox-modal-dialog-solutions/</link>
		<comments>http://www.1stwebdesigner.com/freebies/ajax-lightbox-modal-dialog-solutions/#comments</comments>
		<pubDate>Thu, 18 Nov 2010 10:00:38 +0000</pubDate>
		<dc:creator>Jane Bernardo</dc:creator>
				<category><![CDATA[Freebies]]></category>
		<category><![CDATA[ajax]]></category>
		<category><![CDATA[lightbox]]></category>
		<category><![CDATA[Model Dialog]]></category>
		<category><![CDATA[Resources]]></category>
		<category><![CDATA[Roundup]]></category>

		<guid isPermaLink="false">http://www.1stwebdesigner.com/?p=33118</guid>
		<description><![CDATA[Modal Dialog and Lightbox are Ajax solutions for displaying the content inside the browser without reloading the whole page. Lightboxes overcome the use of the pop up window to suit on the modern browsers and it is being used everywhere these days.  It is widely used for  displaying of media files, webpages , messages, forms [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.1stwebdesigner.com/resources/ajax-lightbox-modal-dialog-solutions/"><img class="size-full wp-image-33119 alignleft" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox.jpg" alt="" width="150" height="150" /></a>Modal Dialog and Lightbox are Ajax solutions for displaying the content inside the browser without reloading the whole page. Lightboxes overcome the use of the pop up window to suit on the modern browsers and it is being used everywhere these days.  It is widely used for  displaying of media files, webpages , messages, forms etc in a nice looking overlay.</p>
<p>In this post, I&#8217;ll be featuring 30 awesome lightbox and modal dialog boxes that you can use on you web applications.<span id="more-33118"></span></p>
<h2><a href="http://chriswanstrath.com/facebox/">1. Facebox</a></h2>
<p>Facebox is a jQuery-based, Facebook-style lightbox which can display images, divs, or entire remote pages.                                        It&#8217;s simple to use and easy on the eyes.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox1.jpg"><img class="alignnone size-full wp-image-33124" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox1.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://www.huddletogether.com/projects/lightbox2/">2. Lightbox2</a></h2>
<p>Lightbox is a <em>simple, unobtrusive</em> script used to overlay images on the current page. It&#8217;s a <em>snap to setup</em> and works on <em>all modern browsers</em>.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox2.jpg"><img class="alignnone size-full wp-image-33125" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox2.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://fancy.klade.lv/">3. Fancybox</a></h2>
<p>FancyBox is a tool for displaying images, html content and multi-media  in a Mac-style &#8220;lightbox&#8221; that floats overtop of web page.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox3.jpg"><img class="alignnone size-full wp-image-33126" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox3.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://colorpowered.com/colorbox/">4. Colorbox</a></h2>
<p>A light-weight, customizable lightbox plugin for jQuery 1.3 and 1.4. Supports photos, grouping, slideshow, ajax, inline, and iframed content.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox4.jpg"><img class="alignnone size-full wp-image-33128" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox4.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://leandrovieira.com/projects/jquery/lightbox/">5. jQuery Lightbox Plugin</a></h2>
<p>jQuery lightBox plugin is simple, elegant, unobtrusive, no need extra markup and is used to overlay images on the current page through the power and flexibility of jQuery´s selector.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox5.jpg"><img class="alignnone size-full wp-image-33129" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox5.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://www.no-margin-for-errors.com/projects/prettyPhoto-jquery-lightbox-clone/">6. prettyPhoto</a></h2>
<p>prettyPhoto is a jQuery lightbox clone. Not only does it support images, it also support for videos, flash, YouTube, iframes.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox6.jpg"><img class="alignnone size-full wp-image-33130" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox6.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://www.doknowevil.net/litebox/">7. Litebox</a></h2>
<p>Lightweight lightbox which built on moo.fx and prototype.lite.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox7.jpg"><img class="alignnone size-full wp-image-33131" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox7.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://jquery.com/demo/thickbox/">8. Thickbox</a></h2>
<p>It has more features than lightbox2  like display inline content, iframed content or  content served through ajax in a hybrid modal.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox8.jpg"><img class="alignnone size-full wp-image-33132" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox8.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://www.digitalia.be/software/slimbox2">9. Slimbox</a></h2>
<p>It was designed to be very small, efficient, standards-friendly, fully  customizable, more convenient and 100% compatible with the original  Lightbox 2.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox9.jpg"><img class="alignnone size-full wp-image-33133" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox9.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://www.nickstakenburg.com/projects/lightview/">10. LightView</a></h2>
<p>Lightview was built to change the way you overlay content on a website that supports multiple media files.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox10.jpg"><img class="alignnone size-full wp-image-33134" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox10.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://jqueryui.com/demos/dialog/">11. jQuery Dialog</a></h2>
<p>Query UI contains dialog component. It can be customized to create your own taste of image preview or gallery.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox11.jpg"><img class="alignnone size-full wp-image-33135" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox11.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://prototype-window.xilinus.com/samples.html">12. Prototype Window</a></h2>
<p>Prototype window based dialog boxes.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox12.jpg"><img class="alignnone size-full wp-image-33136" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox12.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://mochaui.com/">13. MochaUI</a></h2>
<p>MochaUI is a web applications user interface library built on the Mootools JavaScript framework.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox13.jpg"><img class="alignnone size-full wp-image-33137" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox13.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://onehackoranother.com/projects/jquery/boxy/">14. Boxy</a></h2>
<p>Boxy is a flexible, Facebook-style dialog box for jQuery with support for dragging   and size tweening.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox14.jpg"><img class="alignnone size-full wp-image-33138" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox14.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://www.wildbit.com/labs/modalbox/">15. ModalBox</a></h2>
<p>It&#8217;s inspired by Mac OS X modal dialogs.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox15.jpg"><img class="alignnone size-full wp-image-33139" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox15.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://www.shadowbox-js.com/">16. Shadowbox</a></h2>
<p>Shadowbox is a web-based media viewer application that supports all of the web&#8217;s most popular media publishing formats. Shadowbox is written entirely in JavaScript and CSS and is highly customizable.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox16.jpg"><img class="alignnone size-full wp-image-33140" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox16.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://www.stickmanlabs.com/lightwindow/">17. LightWindows</a></h2>
<p>A lightbox solutions that enable you to embed images, video,iFrame, flash and more.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox17.jpg"><img class="alignnone size-full wp-image-33275" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox17.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://www.ericmmartin.com/projects/simplemodal/#demo">18. SimpleModal</a></h2>
<p>impleModal gives you the flexibility to build whatever you can envision,  while shielding you from related cross-browser issues inherent with UI  development.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox18.jpg"><img class="alignnone size-full wp-image-33276" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox18.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://dev.iceburg.net/jquery/jqModal/#examples">19. jqModal</a></h2>
<p>jqModal is a plugin for jQuery to help  you display notices, dialogs, and modal windows in a web browser. It is  flexible and tiny, akin to a &#8220;Swiss Army Knife&#8221;, and makes a great base  as a general purpose windowing framework</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox19.jpg"><img class="alignnone size-full wp-image-33277" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox19.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://www.phatfusion.net/lightbox/">20. Multibox</a></h2>
<p>It support images,flash, video, mp3 and html and it is built with mootools.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox20.jpg"><img class="alignnone size-full wp-image-33278" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox20.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://orangoo.com/labs/GreyBox/">21. Greybox</a></h2>
<p>GreyBox can be used to display websites, images and other content in a beautiful way.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox21.jpg"><img class="alignnone size-full wp-image-33279" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox21.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://highslide.com/">22. Highslide</a></h2>
<p>Highslide JS is an image, media and gallery viewer written in JavaScript. It has a quick and elegant looking.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox22.jpg"><img class="alignnone size-full wp-image-33280" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox22.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://nofunc.org/Sexy_Box/">23. Sexybox</a></h2>
<p>Lightbox that display content directly from html.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox23.jpg"><img class="alignnone size-full wp-image-33281" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox23.jpg" alt="" width="570" height="400" /></a></p>
<h2><a title="PiroBox" href="http://www.pirolab.it/pirobox/#howto" target="_blank">24. PiroBox</a></h2>
<p>Stylish and modern jquery lightbox.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox24.jpg"><img class="alignnone size-full wp-image-33283" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox24.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://www.pierrebertet.net/projects/jquery_superbox/" target="_blank">25. Super Box</a></h2>
<p>Super Box is a script which allows you display windows with the lightbox effect.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox25.jpg"><img class="alignnone size-full wp-image-33284" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox25.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://catcubed.com/2008/12/23/ceebox-a-thickboxvideobox-mashup/" target="_blank">26. CeeBox</a></h2>
<p>It is an overlay popup script that embeds flash video, display images, or show html.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox26.jpg"><img class="alignnone size-full wp-image-33285" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox26.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://nyromodal.nyrodev.com/" target="_blank">27. NyroModal</a></h2>
<p>Modal box that uses callback animation and a lot more features.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox27.jpg"><img class="alignnone size-full wp-image-33286" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox27.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://jqueryglobe.com/labs/imgbox/" target="_blank">28. imgBox</a></h2>
<p>mgBox is a jQuery plugin that implements a smooth zoom effect on images.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox28.jpg"><img class="alignnone size-full wp-image-33287" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox28.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://www.clearbox.hu/index_en.html">29. ClearBox</a></h2>
<p>Clearbox is a professional image and content viewer overlay window.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox30.jpg"><img class="alignnone size-full wp-image-33289" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox30.jpg" alt="" width="570" height="400" /></a></p>
<h2><a href="http://flowplayer.org/tools/overlay/index.html">30. jQuery Tools</a></h2>
<p>jQuery Tools is a collection of most user interface components for modern websites such as lightboxes.</p>
<p><a href="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox31.jpg"><img class="alignnone size-full wp-image-33290" title="lightbox" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/11/lightbox31.jpg" alt="" width="570" height="400" /></a></p>
<p>Choose the appropriate lightbox or modal box on your website.  Next time your users visit they will be attracted on these modern trend and design for your website.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.1stwebdesigner.com/freebies/ajax-lightbox-modal-dialog-solutions/feed/</wfw:commentRss>
		<slash:comments>11</slash:comments>
		</item>
		<item>
		<title>37 Fresh jQuery Image And Gallery Display Solutions</title>
		<link>http://www.1stwebdesigner.com/css/fresh-jquery-image-gallery-display-solutions/</link>
		<comments>http://www.1stwebdesigner.com/css/fresh-jquery-image-gallery-display-solutions/#comments</comments>
		<pubDate>Tue, 05 Jan 2010 16:29:49 +0000</pubDate>
		<dc:creator>Dainis Graveris</dc:creator>
				<category><![CDATA[Coding]]></category>
		<category><![CDATA[Freebies]]></category>
		<category><![CDATA[JS & AJAX]]></category>
		<category><![CDATA[gallery]]></category>
		<category><![CDATA[image]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[jquery]]></category>
		<category><![CDATA[lightbox]]></category>
		<category><![CDATA[slideshow]]></category>
		<category><![CDATA[webdesign]]></category>
		<category><![CDATA[webdev]]></category>

		<guid isPermaLink="false">http://www.1stwebdesigner.com/?p=4483</guid>
		<description><![CDATA[jQuery is already very popular because it is very fast and concise Javacript library simplifing and different event handling, smooth animation with very little code. With jQuery you can enjoy new way of web development and image galleries are the best way to use it effectively! Here you&#8217;ll have more than 35 different unique jQuery [...]]]></description>
			<content:encoded><![CDATA[<p>jQuery is already very popular because it is very fast and concise Javacript library simplifing and different event handling, smooth animation with very little code. With jQuery you can enjoy new way of web development and image galleries are the best way to use it effectively! Here you&#8217;ll have more than 35 different unique jQuery Javascript solutions for beautiful image galleries and great ways to display your images with light code.<span id="more-4483"></span></p>
<p>To make it even easier for you to choose, I also added live demo link under every jQuery plugin! However if you are searching for even more alternatives with Flash, plain CSS or another Javascript library, check out this post -<a href="http://www.1stwebdesigner.com/resources/57-free-image-gallery-slideshow-and-lightbox-solutions/">57+ Free Image Gallery, Slideshow And Lightbox Solutions</a>.</p>
<h2><a href="https://www.e-junkie.com/ecom/gb.php?ii=805274&amp;c=ib&amp;aff=102266&amp;cl=19780" target="ejejcsingle"><br />
1. PhotoSquare Photography WordPress Theme ($79)</a></h2>
<p>PhotoSquares is very flexible premium gallery WordPress theme that is perfect way for designers and photographers to display their portfolio.</p>
<p>This theme allows you to set your own thumbnail sizes so everyone will be able to create most suitable layout.</p>
<p><a href="https://www.e-junkie.com/ecom/gb.php?ii=805274&amp;c=ib&amp;aff=102266&amp;cl=19780" target="ejejcsingle"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/photosquares-premium-wordpress-photography-theme.jpg" alt="Photosquares-premium-wordpress-photography-theme" border="0" /></a></p>
<h2>2. <a href="http://spaceforaname.com/galleryview" target="_blank">GalleryView: A jQuery Content Gallery Plugin</a></h2>
<p>GalleryView aims to provide jQuery users with a flexible, attractive content gallery that is both easy to implement and a snap to customize.</p>
<p><a href="http://spaceforaname.com/galleryview" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/gallery-view-jquery-image-slideshow-tools-free.jpg" alt="gallery-view-jquery-image-slideshow-tools-free" width="570" height="289" /></a></p>
<p><a href="http://spaceforaname.com/webcomics.html" target="_blank">View Demo</a></p>
<h2>2.1. <a href="http://codecanyon.net/item/sexy-slider/87148?ref=1stwebdesigner">Sexy Slider</a></h2>
<p>SexySlider is a JQuery plugin that lets you easily create powerful javascript Sliders with very nice transition effects. Enhance your website by adding a unique and attractive slider!</p>
<p><a href="http://codecanyon.net/item/sexy-slider/87148?ref=1stwebdesigner"><img class="alignnone" title="Sexy Image Slider" src="http://0.s3.envato.com/files/1078316/1.jpg" alt="" width="590" height="300" /></a></p>
<p><a href="http://codecanyon.net/item/sexy-slider/full_screen_preview/87148?ref=1stwebdesigner">View Demo</a></p>
<h2>3. <a href="http://www.meadmiracle.com/SlidingGallery.aspx" target="_blank">Sliding Image Gallery jQuery Plug-in</a></h2>
<p>The SlidingGallery plug-in will take a group of images and turn them into a cyclical gallery of images which the user can click through. One image will be centered on the screen, with two smaller images off to the sides. The user can click either of the smaller images to bring them to the center, or the center image to enlarge it. For optimal use, this plug-in should be applied to seven or more images, but can work with fewer (images will be duplicated in order to bring the total to seven).</p>
<p><a href="http://www.meadmiracle.com/SlidingGallery.aspx" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/sliding-gallery-jquery-image-slideshow-tools-free.jpg" alt="sliding-gallery-jquery-image-slideshow-tools-free" width="570" height="246" /></a></p>
<p><a href="http://www.meadmiracle.com/SlidingGalleryDemo1.htm" target="_blank">View Demo</a></p>
<h2>4. <a href="http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/" target="_blank">PrettyPhoto jQuery Lightbox Clone</a></h2>
<p>PrettyPhoto is a jQuery based lightbox clone. Not only does it support images, it also add support for videos, flash, YouTube, iFrames. It’s a full blown media lightbox. The setup is easy and quick, plus the script is compatible in every major browser.</p>
<p><a href="http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/prettyphoto-gallery-jquery-image-slideshow-tools-free.jpg" alt="prettyphoto-gallery-jquery-image-slideshow-tools-free" width="570" height="358" /></a></p>
<p><a href="http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/" target="_blank">View Demo</a></p>
<h2>5. <a href="http://www.dreamcss.com/2009/04/create-beautiful-jquery-sliders.html" target="_blank">Create Beautiful jQuery slider tutorial</a></h2>
<p>This tutorial explains how to develop Create Beautiful jQuery sliders tutorial with image description and name.</p>
<p><a href="http://www.dreamcss.com/2009/04/create-beautiful-jquery-sliders.html" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/beautiful-gallery-jquery-image-slideshow-tools-free.jpg" alt="beautiful-gallery-jquery-image-slideshow-tools-free" width="570" height="166" /></a></p>
<p><a href="http://gadgetinspiration.com/blog/wp-content/uploads/jquery%20sliders/index.html" target="_blank">View Demo</a></p>
<h2>6. <a href="http://coffeescripter.com/2009/07/ad-gallery-a-jquery-gallery-plugin/" target="_blank">AD Gallery – a jQuery gallery plugin</a></h2>
<p>A highly customizable gallery/showcase plugin for jQuery.</p>
<p><a href="http://coffeescripter.com/2009/07/ad-gallery-a-jquery-gallery-plugin/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/ad-gallery-jquery-image-slideshow-tools-free.jpg" alt="ad-gallery-jquery-image-slideshow-tools-free" width="570" height="432" /></a></p>
<p><a href="http://coffeescripter.com/code/ad-gallery/" target="_blank">View Demo</a></p>
<h2>7. <a href="http://fancybox.net/" target="_blank">FancyBox</a></h2>
<p>FancyBox is a tool for displaying images, html content and multi-media in a Mac-style &#8220;lightbox&#8221; that floats overtop of web page.</p>
<p><a href="http://fancybox.net/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/fancybox-gallery-jquery-image-slideshow-tools-free.jpg" alt="fancybox-gallery-jquery-image-slideshow-tools-free" width="570" height="285" /></a></p>
<p><a href="http://fancybox.net/dev/130/" target="_blank">View Demo</a></p>
<h2>8. <a href="http://www.shadowbox-js.com/" target="_blank">Shadowbox</a></h2>
<p>Shadowbox is an online media viewer application that supports all of the web&#8217;s most popular media publishing formats. Shadowbox is written entirely in JavaScript and CSS and is highly customizable. Using Shadowbox, website authors can showcase a wide assortment of media in all major browsers without navigating users away from the linking page.</p>
<p><a href="http://www.shadowbox-js.com/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/shadowbox-gallery-jquery-image-slideshow-tools-free.jpg" alt="shadowbox-gallery-jquery-image-slideshow-tools-free" width="570" height="379" /></a></p>
<p><a href="http://www.shadowbox-js.com/" target="_blank">View Demo</a></p>
<h2>8.1.<a href="http://codecanyon.net/item/aviaslider-jquery-slideshow/105090?ref=1stwebdesigner">AviaSlider &#8211; jQuery Slideshow</a></h2>
<p>AviaSlider is a very flexible and easy to use Image slideshow plugin for jQuery with a set of really unique transitions that were nver available before, as well as some basic transitions, so the slider will fit into every project.<br />
It comes with an image preloader so the slider starts when images are ready to be shown. No clumsy animations with half loaded images.</p>
<p><a href="http://codecanyon.net/item/aviaslider-jquery-slideshow/105090?ref=1stwebdesigner"><img class="alignnone" title="AviaSlider - jQuery Slideshow" src="http://1.s3.envato.com/files/337813.jpg" alt="" width="590" height="300" /></a></p>
<p><a href="http://codecanyon.net/item/aviaslider-jquery-slideshow/full_screen_preview/105090?ref=1stwebdesigner">View Demo</a></p>
<h2>9. <a href="http://www.twospy.com/galleriffic/index.html" target="_blank">Galleriffic</a></h2>
<p>Galleriffic is a jQuery plugin that provides a rich, post-back free experience optimized to handle high volumes of photos while conserving bandwidth. I am not so great at spelling, and it was much later that I realized that the more appropriate spellings would be Gallerific or Gallerrific, but is too late now for a name change, so Galleriffic remains.</p>
<p><a href="http://www.twospy.com/galleriffic/index.html" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/galleriffic-gallery-jquery-image-slideshow-tools-free.jpg" alt="galleriffic-gallery-jquery-image-slideshow-tools-free" width="570" height="369" /></a></p>
<p><a href="http://www.twospy.com/galleriffic/example-2.html" target="_blank">View Demo</a></p>
<h2>10. <a href="http://colorpowered.com/colorbox/" target="_blank">Colorbox</a></h2>
<p>A light-weight, customizable lightbox plugin for jQuery 1.3.</p>
<p><a href="http://colorpowered.com/colorbox/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/colorbox-gallery-jquery-image-slideshow-tools-free.jpg" alt="colorbox-gallery-jquery-image-slideshow-tools-free" width="570" height="292" /></a></p>
<p><a href="http://colorpowered.com/colorbox/core/example1/index.html" target="_blank">View Demo</a></p>
<h2>11. <a href="http://planetozh.com/projects/lightbox-clones/" target="_blank">The Lightbox Clones Matrix</a></h2>
<p>Comparison of various scripts that display images and other objects in somehow cool CSS popups</p>
<p><a href="http://planetozh.com/projects/lightbox-clones/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/lightbox-clones-jquery-image-slideshow-tools-free.jpg" alt="lightbox-clones-jquery-image-slideshow-tools-free" width="570" height="285" /></a></p>
<h2>12. <a href="http://devkick.com/blog/full-screen-image-gallery-using-jquery-and-flickr/" target="_blank">Full screen image gallery using jQuery and Flickr</a></h2>
<p>It’s a full screen image gallery that automatically scales the image with kept aspect ratio to fill the browser background. It also supports a flickr search engine, thumbnails, captions, preloader and some other goodies.</p>
<p><a href="http://devkick.com/blog/full-screen-image-gallery-using-jquery-and-flickr/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/fs-gallery-jquery-image-slideshow-tools-free.jpg" alt="fs-gallery-jquery-image-slideshow-tools-free" width="570" height="285" /></a></p>
<p><a href="http://devkick.com/lab/fsgallery/" target="_blank">View Demo</a></p>
<h2>13. <a href="http://css-tricks.com/moving-boxes/" target="_blank">Moving Boxes</a></h2>
<p><a href="http://css-tricks.com/moving-boxes/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/moving-boxes-gallery-jquery-image-slideshow-tools-free.jpg" alt="moving-boxes-gallery-jquery-image-slideshow-tools-free" width="570" height="262" /></a></p>
<p><a href="http://css-tricks.com/examples/MovingBoxes/" target="_blank">View Demo</a></p>
<h2>13.1. <a href="http://codecanyon.net/item/ddslider-10-transitions-inline-content-support/104797?ref=1stwebdesigner">DDSlider &#8211; 10 Transitions &#8211; Inline Content Support</a></h2>
<p>DDSlider introduces a new easy-to-go slider with 9 different unique transitions (+fading &amp; random—11 total) that support Inline Content. You can also have multiple sliders in the same page.</p>
<p><a href="http://codecanyon.net/item/ddslider-10-transitions-inline-content-support/104797?ref=1stwebdesigner"><img class="alignnone" title="DDSlider Image Gallery" src="http://3.s3.envato.com/files/348178.jpg" alt="" width="590" height="300" /></a></p>
<p><a href="http://codecanyon.net/item/ddslider-10-transitions-inline-content-support/full_screen_preview/104797?ref=1stwebdesigner">View Demo</a></p>
<h2>14. <a href="http://css-tricks.com/creating-a-slick-auto-playing-featured-content-slider/" target="_blank">Creating a Slick Auto-Playing Featured Content Slider</a></h2>
<h2><a href="http://css-tricks.com/creating-a-slick-auto-playing-featured-content-slider/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/featured-slider-jquery-image-slideshow-tools-free.jpg" alt="featured-slider-jquery-image-slideshow-tools-free" width="570" height="281" /></a></h2>
<p><a href="http://css-tricks.com/examples/FeaturedContentSlider/" target="_blank">View Demo</a></p>
<h2>15. <a href="http://css-tricks.com/startstop-slider/" target="_blank">Start/Stop Slider</a></h2>
<p><a href="http://css-tricks.com/startstop-slider/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/start-stop-gallery-jquery-image-slideshow-tools-free.jpg" alt="start-stop-gallery-jquery-image-slideshow-tools-free" width="570" height="290" /></a></p>
<p><a href="http://css-tricks.com/examples/StartStopSlider/" target="_blank">View Demo</a></p>
<h2>16. <a href="http://www.gcmingati.net/wordpress/wp-content/lab/jquery/svwt/index.html" target="_blank">SlideViewerPro 1.0</a></h2>
<p>SlideViewerPro is a fully customizable jQuery image gallery engine wich allows to create outstanding sliding image galleries for your projects and/or interactive galleries within blog posts.</p>
<p><a href="http://www.gcmingati.net/wordpress/wp-content/lab/jquery/svwt/index.html" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/slide-viewer-jquery-image-slideshow-free-tools.jpg" alt="slide-viewer-jquery-image-slideshow-free-tools" width="570" height="323" /></a></p>
<p><a href="http://www.gcmingati.net/wordpress/wp-content/lab/jquery/svwt/index.html" target="_blank">View Demo</a></p>
<h2>17. <a href="http://www.pirolab.it/pirobox/index.php" target="_blank">Pirobox V.1.2.1</a></h2>
<p><a href="http://www.pirolab.it/pirobox/index.php" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/pirobox-gallery-jquery-image-slideshow-tools-free.jpg" alt="pirobox-gallery-jquery-image-slideshow-tools-free" width="570" height="349" /></a></p>
<p><a href="http://www.pirolab.it/pirobox/index.php" target="_blank">View Demo</a></p>
<h2>18. <a href="http://www.serie3.info/s3slider/" target="_blank">s3Slider jQuery plugin</a></h2>
<p>The s3Slider jQuery plugin is made by example of jd`s smooth slide show script.</p>
<p><a href="http://www.serie3.info/s3slider/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/s3slider-gallery-jquery-image-slideshow-tools-free.jpg" alt="s3slider-gallery-jquery-image-slideshow-tools-free" width="570" height="236" /></a></p>
<p><a href="http://www.serie3.info/s3slider/demonstration.html" target="_blank">View Demo</a></p>
<h2>18.1. <a href="http://codecanyon.net/item/advanced-slider-jquery-xml-slider/132618?ref=1stwebdesigner">Advanced Slider &#8211; jQuery XML slider</a></h2>
<p>Advanced Slider is a jQuery plugin that allows you to easily create powerfull sliders using either XML , thus making the slider much easier to setup and maintain, or using HTML markup. The plugin also provides an easy to use API which will allow to further enhance the functionality of the slider and make it possible to integrate it into your own application. Please take a look at the list of features below.</p>
<p><a href="http://codecanyon.net/item/advanced-slider-jquery-xml-slider/132618?ref=1stwebdesigner"><img class="alignnone" title="jQuery Slider" src="http://3.s3.envato.com/files/2685373/image.jpg" alt="" width="590" height="300" /></a></p>
<p><a href="http://codecanyon.net/item/advanced-slider-jquery-xml-slider/full_screen_preview/132618?ref=1stwebdesigner">View Demo</a></p>
<h2>19. <a href="http://freecss.info/free-css-tutorials/css-and-jquery-creating-image-slider/" target="_blank">CSS and Jquery &#8211; Creating an Image Slider</a></h2>
<p><a href="http://freecss.info/free-css-tutorials/css-and-jquery-creating-image-slider/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/slider-gallery-jquery-image-slideshow-tools-free.jpg" alt="slider-gallery-jquery-image-slideshow-tools-free" width="570" height="316" /></a></p>
<p><a href="http://www.freecss.info/tutorials/1/index.html" target="_blank">View Demo</a><br />
<div id="adsenseads" style="margin:0 15px"><script type="text/javascript"><!--
							google_ad_client = "ca-pub-2552502674694369";
							google_ad_slot = "1448631891";
							google_ad_width = 300;
							google_ad_height = 250;
							//-->
							</script>
							<script type="text/javascript"
							src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
							</script><script type="text/javascript"><!--
				google_ad_client = "ca-pub-2538875746173404";
				/* 300x250, created 3/9/09 */
				google_ad_slot = "5916600540";
				google_ad_width = 300;
				google_ad_height = 250;
				//-->
				</script>
				<script type="text/javascript"
				src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
				</script></div></p>
<h2>20. <a href="http://www.sohtanaka.com/web-design/create-an-image-rotator/" target="_blank">Create an Image Rotator with Description (CSS/jQuery)</a></h2>
<p>An image rotator is one great way to display portfolio pieces, eCommerce product images, or even as an image gallery. Although there are many great plugins already, this tutorial will help you understand how the image rotator works and helps you create your own from scratch.</p>
<p><a href="http://www.sohtanaka.com/web-design/create-an-image-rotator/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/rotator-gallery-jquery-image-slideshow-tools-free.jpg" alt="rotator-gallery-jquery-image-slideshow-tools-free" width="570" height="335" /></a></p>
<p><a href="http://www.sohtanaka.com/web-design/examples/image-rotator/" target="_blank">View Demo</a></p>
<h2>21. <a href="http://www.openstudio.fr/jQuery-spherical-panorama-viewer.html?lang=en" target="_blank">jQuery spherical panorama viewer</a></h2>
<p>A javascript viewer for displaying spherical panoramas. An alternative to Java and QuickTime technology.</p>
<p><a href="http://www.openstudio.fr/jQuery-spherical-panorama-viewer.html?lang=en" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/panorama-gallery-jquery-image-slideshow-tools-free.jpg" alt="panorama-gallery-jquery-image-slideshow-tools-free" width="570" height="416" /></a></p>
<p><a href="http://www.openstudio.fr/jQuery-spherical-panorama-viewer.html?lang=en" target="_blank">View Demo</a></p>
<h2>22. <a href="http://hotajax.org/jquery/photos-other-plugins/554-zoomimage-jquery-plugin.html" target="_blank">Zoomimage &#8211; jQuery plugin</a></h2>
<p>Present you images in stylish way. The links are unobtrusively highjacked to open the images in an inpage popup with drop shadow and border.</p>
<p><a href="http://hotajax.org/jquery/photos-other-plugins/554-zoomimage-jquery-plugin.html" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/zoom-gallery-jquery-image-slideshow-tools-free.jpg" alt="zoom-gallery-jquery-image-slideshow-tools-free" width="570" height="328" /></a></p>
<p><a href="http://www.hotajax.org/demo/jquery/zoomimage/zoomimage/index.html" target="_blank">View Demo</a></p>
<h2>23. <a href="http://net.tutsplus.com/tutorials/javascript-ajax/building-a-jquery-image-scroller/" target="_blank">Building a jQuery Image Scroller</a></h2>
<p><a href="http://net.tutsplus.com/tutorials/javascript-ajax/building-a-jquery-image-scroller/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/scroller-jquery-image-slideshow-tools-free.jpg" alt="scroller-jquery-image-slideshow-tools-free" width="570" height="220" /></a></p>
<p><a href="http://nettuts.s3.cdn.plus.org/300_jquery/image%20Scroller/imageScroller.html" target="_blank">View Demo</a></p>
<h2>24. <a href="http://cssglobe.com/post/5780/easy-slider-17-numeric-navigation-jquery-slider" target="_blank">Easy Slider 1.5 &#8211; The Easiest jQuery Plugin For Sliding Images and Content</a></h2>
<p><a href="http://cssglobe.com/post/5780/easy-slider-17-numeric-navigation-jquery-slider" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/cssglobe-gallery-jquery-image-slideshow-tools-free.jpg" alt="cssglobe-gallery-jquery-image-slideshow-tools-free" width="570" height="233" /></a></p>
<p><a href="http://cssglobe.com/lab/easyslider1.7/01.html" target="_blank">View Demo</a></p>
<h2>25. <a href="http://www.catchmyfame.com/2009/05/02/jquery-panel-gallery-plugin/" target="_blank">jQuery Panel Gallery Plugin</a></h2>
<ul>
<li>
<div>No slicing or editing of the images is needed</div>
</li>
<li>
<div>It’s just 5K</div>
</li>
<li>
<div>Easily configurable</div>
</li>
<li>
<div>Reusable on multiple containers</div>
</li>
</ul>
<p><a href="http://www.catchmyfame.com/2009/05/02/jquery-panel-gallery-plugin/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/panel-jquery-image-slideshow-free-tools.jpg" alt="panel-jquery-image-slideshow-free-tools" width="570" height="195" /></a></p>
<p><a href="http://www.catchmyfame.com/jquery/demo/3/" target="_blank">View Demo</a></p>
<h2>25.1. <a href="http://codecanyon.net/item/ubillboard-premium-slider-for-wordpress/124783?ref=1stwebdesigner">uBillboard &#8211; Premium Slider for WordPress</a></h2>
<p>uBillboard is a Premium Slider for WordPress. It is a jQuery based slider with a multitude of transitions and options for you to be able to customize it to your needs while not overwhelming you with options you never wanted or needed. Version 3 is a revolutionary release with most of the codebase rewritten from scratch. This has enabled us to integrate many features that you have been requesting during the first year.</p>
<p><a href="http://codecanyon.net/item/ubillboard-premium-slider-for-wordpress/124783?ref=1stwebdesigner"><img class="alignnone" title="uBillboard Premium Slider for WordPress" src="http://1.s3.envato.com/files/4746524/preview.jpg" alt="" width="590" height="300" /></a></p>
<p><a href="http://codecanyon.net/item/ubillboard-premium-slider-for-wordpress/full_screen_preview/124783?ref=1stwebdesigner">View Demo</a></p>
<h2>26. <a href="http://www.buildinternet.com/project/supersized/" target="_blank">Supersized &#8211; Full Screen Background/Slideshow jQuery Plugin</a></h2>
<p><a href="http://www.buildinternet.com/project/supersized/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/supersized-gallery-jquery-image-slideshow-tools-free.jpg" alt="supersized-gallery-jquery-image-slideshow-tools-free" width="570" height="252" /></a></p>
<p><a href="http://www.buildinternet.com/project/supersized/default.php" target="_blank">View Demo</a></p>
<h2>27. <a href="http://pikachoose.com/" target="_blank">Pikachoose</a></h2>
<p>Pikachoose is a lightweight Jquery plugin that allows easy presentation of photos with options for slideshows, navigation buttons, and auto play. Pikachoose is designed to be easily installed, easy to setup, and well… all around easy. Creating an image gallery shouldn’t be a complex thing. I’ve created a new plugin that I’m packaging with PikaChoose called SliderJS.</p>
<p><a href="http://pikachoose.com/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/pikachoose-jquery-image-slideshow-free-tools.jpg" alt="pikachoose-jquery-image-slideshow-free-tools" width="570" height="265" /></a></p>
<p><a href="http://pikachoose.com/demo/" target="_blank">View Demo</a></p>
<h2>28. <a href="http://www.ferretarmy.com/files/jQuery/ImageOverlay/ImageOverlay.html" target="_blank">jQuery Image Overlay Plugin</a></h2>
<p>The image overlay plugin is a simple jQuery plugin that attempts to present an image with an overlaid title/caption. The overlay drops in on hover, as you can see above.</p>
<p><a href="http://www.ferretarmy.com/files/jQuery/ImageOverlay/ImageOverlay.html" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/overlay-jquery-image-slideshow-tools-free.jpg" alt="overlay-jquery-image-slideshow-tools-free" width="570" height="247" /></a></p>
<p><a href="http://www.ferretarmy.com/files/jQuery/ImageOverlay/ImageOverlay.html" target="_blank">View Demo</a></p>
<h2>29. <a href="http://odyniec.net/projects/imgareaselect/" target="_blank">imgAreaSelect</a></h2>
<p>imgAreaSelect is a jQuery plugin for selecting a rectangular area of an image. It allows web developers to easily implement image cropping functionality, as well as other user interface features, such as photo notes (like those on Flickr).</p>
<p>Plugin features:</p>
<ul>
<li>Highly configurable</li>
<li>Customizable with CSS styling</li>
<li>Handles scaled images</li>
<li>Keyboard support for moving and resizing the selection</li>
<li>Supports callback functions</li>
<li>Provides API functions for easier integration with other application components</li>
<li>Lightweight — the packed version is less than 8KB</li>
</ul>
<p><a href="http://odyniec.net/projects/imgareaselect/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/imgarea-select-gallery-jquery-image-slideshow-tools-free.jpg" alt="imgarea-select-gallery-jquery-image-slideshow-tools-free" width="570" height="281" /></a></p>
<p><a href="http://odyniec.net/projects/imgareaselect/" target="_blank">View Demo</a></p>
<h2>30. <a href="http://plugins.jquery.com/project/pfeloader" target="_blank">PFeloader</a></h2>
<p>This is a preloader, it scans DOM and loaded StyleSheet&#8217;s for occurence of images (in sheet, style, as element).</p>
<p>StyleSheet file has to be in the same domain as page using it.</p>
<p><a href="http://arkus.malopolska.pl/skryptoplikacje/jquery/demos/pfeloader/index.html" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/loading-gallery-jquery-image-slideshow-tools-free.jpg" alt="loading-gallery-jquery-image-slideshow-tools-free" width="570" height="317" /></a></p>
<p><a href="http://arkus.malopolska.pl/skryptoplikacje/jquery/demos/pfeloader/index.html" target="_blank">View Demo</a></p>
<h2>30.1. <a href="http://codecanyon.net/item/jquery-horizontal-image-scroller-w-lightbox/112734?ref=1stwebdesigner">jQuery Horizontal Image Scroller w/ Lightbox</a></h2>
<p>This is a jQuery image scroller with lightbox. The scroll bar/indexes and directional buttons allow for easy navigation of your image gallery. Image click can either open the included lightbox or a regular link. The scroller is also re-sizable and fully configurable through the plugin’s parameters.</p>
<p><a href="http://codecanyon.net/item/jquery-horizontal-image-scroller-w-lightbox/112734?ref=1stwebdesigner"><img class="alignnone" title="jQuery Horizontal Image Scroller Lightbox" src="http://3.s3.envato.com/files/1684025/preview.jpg" alt="" width="590" height="300" /></a></p>
<p><a href="http://codecanyon.net/item/jquery-horizontal-image-scroller-w-lightbox/full_screen_preview/112734?ref=1stwebdesigner">View Demo</a></p>
<h2>31. <a href="http://justinfarmer.com/?p=31" target="_blank">Image Reveal using jQuery</a></h2>
<p><a href="http://justinfarmer.com/?p=31" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/enlargement-gallery-jquery-image-slideshow-tools-free.jpg" alt="enlargement-gallery-jquery-image-slideshow-tools-free" width="570" height="271" /></a></p>
<p><a href="http://justinfarmer.com/tutorials/imgviewerenlarge/imgviewer_enlarge.html" target="_blank">View Demo</a></p>
<h2>32. <a href="http://www.malsup.com/jquery/cycle/" target="_blank">The jQuery Cycle Plugin</a></h2>
<p>The jQuery Cycle Plugin is a lightweight slideshow plugin. It supports pause-on-hover, auto-stop, auto-fit, before/after callbacks, click triggers and many transition effects. It also supports, but does not require, the Metadata Plugin and the Easing Plugin.</p>
<p><a href="http://www.malsup.com/jquery/cycle/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/cycle-gallery-jquery-image-slideshow-tools-free.jpg" alt="cycle-gallery-jquery-image-slideshow-tools-free" width="570" height="201" /></a></p>
<p><a href="http://www.malsup.com/jquery/cycle/" target="_blank">View Demo</a></p>
<h2>33. <a href="http://devkick.com/lab/galleria/demo_01.htm#img/grass-blades.jpg" target="_blank">Galleria Plugin</a></h2>
<p>This demonstration shows you aome more advanced effects you can accomplish with the Galleria plugin. The history object is also active, so feel free to try the back button in your browser and bookmark a page. The next and previous links are simple to create since the galleria object has two public functions for traversing the images in your list.</p>
<p><a href="http://devkick.com/lab/galleria/demo_01.htm#img/grass-blades.jpg" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/galleria-jquery-image-slideshow-tools-free.jpg" alt="galleria-jquery-image-slideshow-tools-free" width="570" height="326" /></a></p>
<p><a href="http://devkick.com/lab/galleria/demo_01.htm#img/grass-blades.jpg" target="_blank">View Demo</a></p>
<h2>34. <a href="http://www.gruppo4.com/~tobia/cross-slide.shtml" target="_blank">CrossSlide jQuery plugin</a></h2>
<p>CrossSlide is a jQuery plugin that implements in Javascript some common slide-show animations, traditionally only available to the web developer via Adobe Flash™ or other proprietary plugins. CrossSlide builds upon jQuery&#8217;s animation facility, so it is as portable across browsers as jQuery itself (a lot.)</p>
<p><a href="http://www.gruppo4.com/~tobia/cross-slide.shtml" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/crosslide-jquery-image-slideshow-tools-free.jpg" alt="crosslide-jquery-image-slideshow-tools-free" width="570" height="198" /></a></p>
<p><a href="http://www.gruppo4.com/~tobia/cross-slide.shtml" target="_blank">View Demo</a></p>
<h2>35. <a href="http://www.sohtanaka.com/web-design/fancy-thumbnail-hover-effect-w-jquery/" target="_blank">Fancy Thumbnail Hover Effect w/ jQuery</a></h2>
<p><a href="http://www.sohtanaka.com/web-design/fancy-thumbnail-hover-effect-w-jquery/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/fancy-gallery-jquery-image-slideshow-tools-free.jpg" alt="fancy-gallery-jquery-image-slideshow-tools-free" width="570" height="252" /></a></p>
<p><a href="http://www.sohtanaka.com/web-design/examples/image-zoom/" target="_blank">View Demo</a></p>
<h2>36. <a href="http://tutorialzine.com/2009/11/beautiful-apple-gallery-slideshow/" target="_blank">Apple-like Slideshow Gallery</a></h2>
<p><a href="http://tutorialzine.com/2009/11/beautiful-apple-gallery-slideshow/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/apple-gallery-jquery-image-slideshow-tools-free.jpg" alt="apple-gallery-jquery-image-slideshow-tools-free" width="570" height="319" /></a></p>
<p><a href="http://demo.tutorialzine.com/2009/11/beautiful-apple-gallery-slideshow/demo.html" target="_blank">View Demo</a></p>
<h2>36.1. <a href="http://codecanyon.net/item/li-jquery-sliderimage-rotator/153638?ref=1stwebdesigner">li JQuery Slider/Image Rotator</a></h2>
<p>li jQuery Image Slider / Banner Image Rotator is carefully crafted slider/image rotator, full of features, very easy to install and customize. Whenever you need a full featured slider image rotator or you need a simple ad banner, li jQuery Image slider will do the job with ease!</p>
<p>This robust and yet elegant guy, has everything you need to build your next “to-impress” image slider.</p>
<h2><a href="http://codecanyon.net/item/li-jquery-sliderimage-rotator/153638?ref=1stwebdesigner"><img class="alignnone" title="JQuery Slider Image Rotator" src="http://3.s3.envato.com/files/1621503/preview.jpg" alt="" width="590" height="300" /></a></h2>
<p><a href="http://codecanyon.net/item/li-jquery-sliderimage-rotator/full_screen_preview/153638?ref=1stwebdesigner">View Demo</a></p>
<h2>37. <a href="http://www.mind-projects.it/projects/jqzoom/" target="_blank">JQZoom</a></h2>
<p>JQZoom is a javascript image magnifier built at the top of the popular jQuery javascript framework.jQzoom is a great and a really easy to use script to magnify what you want.</p>
<p><a href="http://www.mind-projects.it/projects/jqzoom/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/jqzoom-gallery-jquery-image-slideshow-tools-free.jpg" alt="jqzoom-gallery-jquery-image-slideshow-tools-free" width="570" height="264" /></a></p>
<p><a href="http://www.mind-projects.it/projects/jqzoom/demos.php#demo1" target="_blank">View Demo</a></p>
<h2>38. <a href="http://imageflow.finnrudolph.de/" target="_blank">ImageFlow</a></h2>
<p>ImageFlow is an unobtrusive and userfriendly JavaScript image gallery.</p>
<p><a href="http://imageflow.finnrudolph.de/" target="_blank"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2010/01/jquery-gallery-solutions/flow-gallery-jquery-image-slideshow-tools-free.jpg" alt="flow-gallery-jquery-image-slideshow-tools-free" width="570" height="255" /></a></p>
<p><a href="http://imageflow.finnrudolph.de/" target="_blank">View Demo</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.1stwebdesigner.com/css/fresh-jquery-image-gallery-display-solutions/feed/</wfw:commentRss>
		<slash:comments>122</slash:comments>
		</item>
		<item>
		<title>57+ Free Image Gallery, Slideshow And Lightbox Solutions</title>
		<link>http://www.1stwebdesigner.com/css/57-free-image-gallery-slideshow-and-lightbox-solutions/</link>
		<comments>http://www.1stwebdesigner.com/css/57-free-image-gallery-slideshow-and-lightbox-solutions/#comments</comments>
		<pubDate>Thu, 22 Jan 2009 21:25:10 +0000</pubDate>
		<dc:creator>Dainis Graveris</dc:creator>
				<category><![CDATA[Coding]]></category>
		<category><![CDATA[Freebies]]></category>
		<category><![CDATA[JS & AJAX]]></category>
		<category><![CDATA[Templates]]></category>
		<category><![CDATA[free]]></category>
		<category><![CDATA[gallery]]></category>
		<category><![CDATA[image]]></category>
		<category><![CDATA[lightbox]]></category>
		<category><![CDATA[resource]]></category>
		<category><![CDATA[slideshow]]></category>
		<category><![CDATA[webdesign]]></category>

		<guid isPermaLink="false">http://www.1stwebdesigner.com/?p=2659</guid>
		<description><![CDATA[Actually at first I wanted simple image gallery solution for web design project, but when I started to search I changed my mind and thought how great would be to create article about all the best image gallery solutions available on the Internet. So here it is &#8211; this list is separated in 3 big [...]]]></description>
			<content:encoded><![CDATA[<p>Actually at first I wanted simple image gallery solution for web design project, but when I started to search I changed my mind and thought how great would be to create article about all the best image gallery solutions available on the Internet. So here it is &#8211; this list is separated in 3 big categories like Ajax, JavaScript and Lightbox based galleries, CSS based galleries and FLASH based galleries, so You can easy switch to category You got interest in. I think here You&#8217;ll find gallery for every needs, should be enough to choose from!<span id="more-2659"></span><br />
I wanted also to add comment about free and premium files &#8211; while I was searching for a lot of free quality codes, I still found several commercial solutions, which blew my mind away, but since I wasn&#8217;t there to spend any money I just went further to search for more free image galleries. But yes, while I recommend you mostly to use those free slideshows, sometimes for good paid freelance jobs you have it&#8217;s worth spending little money to really leave impact to your client..and in the meantime you&#8217;re saving time!</p>
<p>Well, I guess what I am suggesting is to always look how much time takes for you to modify, install, setup free solution..and if it takes too much, definitely look into cheap codes, cheap quality tools, where definitely you can spare 5-10$ to save your time, here are few marketplaces I am talking about and using myself on desperate occasions &#8211; <a href="www.mojo-themes.com?r=1stwebdesigner">Mojo-Themes</a> and <a href="http://codecanyon.net/?ref=1stwebdesigner">CodeCanyon</a>! Just thinking, enjoy your free slideshows now &#8211; I know here you&#8217;ll find huge quality as well, just be aware how well supported, upgraded each solution is, because if you&#8217;ll get old buggy code, you won&#8217;t be happy with it! Ok, now let&#8217;s get to the actual article! -</p>
<h2><a href="https://www.e-junkie.com/ecom/gb.php?ii=805274&amp;c=ib&amp;aff=102266&amp;cl=19780" target="ejejcsingle"><br />
PhotoSquare Photography WordPress Theme ($79)</a></h2>
<p>PhotoSquares is very flexible premium gallery WordPress theme that is perfect way for designers and photographers to display their portfolio.</p>
<p>This theme allows you to set your own thumbnail sizes so everyone will be able to create most suitable layout.</p>
<p><a href="https://www.e-junkie.com/ecom/gb.php?ii=805274&amp;c=ib&amp;aff=102266&amp;cl=19780" target="ejejcsingle"><img src="http://cdn1.1stwebdesigner.com/wp-content/uploads/photosquares-premium-wordpress-photography-theme.jpg" border="0" alt="Photosquares-premium-wordpress-photography-theme" /></a></p>
<h4>Ajax, JavaScript ( jQuery, MooTools), Lightbox based galleries</h4>
<p>1. <a href="http://smoothgallery.jondesign.net/" target="_blank">JonDesign&#8217;s SmoothGallery</a></p>
<p>Using MooTools v1.11, this JavaScript gallery and slideshow system allows you to have simple and smooth (cross-fading&#8230;) image galleries, slideshows, showcases and other cool stuff on your website. Together there are 7 different gallery demos, You can download and test for free.</p>
<p>Unlike other systems out there, JonDesign&#8217;s SmoothGallery is designed from the ground up to be standard compliant: You can feed it from any document, using custom CSS selectors. And even better, this solutions is very lightweight: The JavaScript file is only 24kb.</p>
<h5><a href="http://smoothgallery.jondesign.net/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/jondesign-1.jpg" border="0" alt="jondesign-1" width="462" height="347" /></a></h5>
<p>2. <a href="http://minishowcase.net/" target="_blank">MiniShowcase Gallery</a></p>
<p>Minishowcase is a small and simple PHP/JavaScript online photo gallery, powered by AJAX that allows you to easily show your images online, without complex databases or coding, allowing to have an up-and-running gallery in a few minutes.</p>
<p><a href="http://minishowcase.net/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/minishowcase.jpg" border="0" alt="minishowcase" width="570" height="441" /></a></p>
<p>3. <a href="http://www.gcmingati.net/wordpress/wp-content/lab/jquery/imagestrip/imageslide-plugin.html" target="_blank">jQuery SlideViewer</a></p>
<p>SlideViewer is a lightweight (1.5Kb) jQuery plugin which allows to instantly create an image gallery by writing <strong>just few lines</strong> of HTML. SlideViewer checks for the number of images within your list, and dynamically creates a set of links to command (slide) you pictures. Also, clicking on each image will make the gallery slide to the next picture.</p>
<p><a href="http://www.gcmingati.net/wordpress/wp-content/lab/jquery/imagestrip/imageslide-plugin.html" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/slideviewer.jpg" border="0" alt="slideviewer" width="570" height="349" /></a></p>
<p>4. <a href="http://devkick.com/lab/galleria/" target="_blank">DevKick Galleria</a></p>
<p>Galleria is a JavaScript image gallery written in jQuery. It loads the images one by one from an unordered list and displays thumbnails when each image is loaded. It will create thumbnails for you if you choose so, scaled or unscaled, centered and cropped inside a fixed thumbnail box defined by CSS.</p>
<p><a href="http://devkick.com/lab/galleria/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/devkick-galleria.jpg" border="0" alt="devkick-galleria" width="570" height="502" /></a></p>
<p>5. <a href="http://www.zenphoto.org/" target="_blank">ZenPhoto</a></p>
<p>Zenphoto is an answer to lots of calls for an online gallery solution that just makes sense. After years of bloated software that does everything and your dishes, zenphoto just shows your photos, simply. We hope you agree with our philosophy: simpler is better. Don’t get us wrong though – zenphoto really does have everything you need for your online gallery, and you’ll even stare in awe at some of the innovative innovations we innovated upon.</p>
<p>Check out their feature list &#8211; it was too long to long to post here!</p>
<p><a href="http://www.zenphoto.org/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/zenphoto.jpg" border="0" alt="zenphoto" width="570" height="552" /></a><br />
6. <a href="http://codecanyon.net/item/jquery-banner-rotator-slideshow/109046?ref=1stwebdesigner">jQuery Banner Rotator / Slideshow</a> (<a href="http://codecanyon.net/item/jquery-banner-rotator-slideshow/full_screen_preview/109046?ref=1stwebdesigner">Live Demo</a> &#8211; 8$)</p>
<p>This is a jQuery banner rotator plugin featuring multiple transitions. The thumbnails and buttons allow for easy navigation of your banners/ads. The banner rotator is also re-sizable and configurable through the plugin’s parameters.</p>
<p>Features:</p>
<ul>
<li>Multiple transitions available. Also can set a different transition per slide.</li>
<li>Able to load unlimited number of images, each with customizable text description, tooltip, and hyperlink.</li>
<li>Show or hide components, including play/pause button, directional buttons, thumbnails, text panel, and tooltip.</li>
<li>Can set to automatically play on startup with customizable timer delay. Also, can set a different time delay for each slide.</li>
<li>Banner, thumbnails, and buttons are all resizable.</li>
<li>and more..</li>
</ul>
<p><a href="http://codecanyon.net/item/jquery-banner-rotator-slideshow/109046?ref=1stwebdesigner"><img class="alignnone size-full wp-image-40841" title="jquery-banner-rotator" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/jquery-banner-rotator.jpg" alt="" width="570" height="290" /></a></p>
<p>7. <a href="http://visuallightbox.com/" target="_blank">Visual Lightbox</a></p>
<p>VisualLightBox is a free wizard program that helps you easily generate web photo galleries, based on famous LightBox2 script, in a few clicks without writing a single line of code.</p>
<p><a href="http://visuallightbox.com/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/visual-lightbox.jpg" border="0" alt="visual-lightbox" width="570" height="282" /></a></p>
<p>8. <a href="http://nettuts.com/tutorials/javascript-ajax/create-a-spectacular-photo-gallery-with-mootools/" target="_blank">Photo Gallery with MooTools</a></p>
<p>Fully explained tutorial and also spectacular photo gallery to comfortably display many images.</p>
<p><a href="http://nettuts.com/tutorials/javascript-ajax/create-a-spectacular-photo-gallery-with-mootools/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/nettuts-mootools.jpg" border="0" alt="nettuts-mootools" width="570" height="392" /></a></p>
<p>9. <a href="http://orangoo.com/labs/GreyBox/" target="_blank">GreyBox</a></p>
<p>GreyBox can be used to display websites, images and other content in a beautiful way. It is very easy to use full-screen website, image gallery, which doesn&#8217;t conflict with pop-up blockers and it&#8217;s only 22 kb size!</p>
<p><a href="http://orangoo.com/labs/GreyBox/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/orangoo-labs.jpg" border="0" alt="orangoo-labs" width="570" height="214" /></a></p>
<p>10. <a href="http://slideshow.triptracker.net/" target="_blank">TripTracker</a></p>
<p>The TripTracker slideshow is a lightweight JavaScript image viewer with an animated slideshow feature.</p>
<p><a href="http://slideshow.triptracker.net/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/triptracker.jpg" border="0" alt="triptracker" width="570" height="286" /></a></p>
<p>11. <a href="http://qgallery.quadrifolia.de/" target="_blank">qGallery</a></p>
<p>qGallery is a simple to use prototype based gallery script. All image processing is done by the script so you don&#8217;t have to worry about the images you upload on the server. All images for the skimmer graphics and the fullsize view will be created on the fly and stored in a cache directory on the server to save processing power on the server.</p>
<p><a href="http://qgallery.quadrifolia.de/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/qgallery.jpg" border="0" alt="qgallery" width="570" height="336" /></a></p>
<p>12. <a href="http://nettuts.com/javascript-ajax/using-the-wonderful-jflow-plugin-screencast/" target="_blank">jFlow gallery</a></p>
<p>Tutorial and documentation, how to use jFlow plugin to create Your own gallery.</p>
<p><a href="http://nettuts.com/javascript-ajax/using-the-wonderful-jflow-plugin-screencast/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/jflow.jpg" border="0" alt="jflow" width="570" height="298" /></a></p>
<p>13. <a href="http://www.efectorelativo.net/laboratory/noobSlide/" target="_blank">NoobSlide</a></p>
<p>8 different examples how to view Your images using MooTools, unfortunately there isn&#8217;t any documentation, but very easy to use gallery.</p>
<p><a href="http://www.efectorelativo.net/laboratory/noobSlide/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/noobslide.jpg" border="0" alt="noobslide" width="570" height="596" /></a></p>
<p>14. <a href="http://eyecon.ro/spacegallery/" target="_blank">Spacegallery -jQuery plugin</a></p>
<p>Yet another way how to display Your images.</p>
<p><a href="http://eyecon.ro/spacegallery/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/spacegallery.jpg" border="0" alt="spacegallery" width="570" height="320" /></a></p>
<p>15.1. <a href="http://codecanyon.net/item/sexy-slider/87148?ref=1stwebdesigner">Sexy Slider </a>(<a href="http://codecanyon.net/item/sexy-slider/full_screen_preview/87148?ref=1stwebdesigner">Live Demo</a> &#8211; 7$)</p>
<p>SexySlider is a JQuery plugin that lets you easily create powerful javascript Sliders with very nice transition effects. Enhance your website by adding a unique and attractive slider!</p>
<p>More examples: <a style="outline-width: 0px; outline-style: initial; outline-color: initial; font-weight: inherit; font-style: inherit; font-size: 13px; font-family: inherit; vertical-align: baseline; text-decoration: none; color: #bb3e26; padding: 0px; margin: 0px; border: 0px initial initial;" href="http://s3.envato.com/files/351371/example_1.html">Example 1</a> <a style="outline-width: 0px; outline-style: initial; outline-color: initial; font-weight: inherit; font-style: inherit; font-size: 13px; font-family: inherit; vertical-align: baseline; text-decoration: none; color: #bb3e26; padding: 0px; margin: 0px; border: 0px initial initial;" href="http://s3.envato.com/files/351371/example_2.html">Example 2</a> <a style="outline-width: 0px; outline-style: initial; outline-color: initial; font-weight: inherit; font-style: inherit; font-size: 13px; font-family: inherit; vertical-align: baseline; text-decoration: none; color: #bb3e26; padding: 0px; margin: 0px; border: 0px initial initial;" href="http://s3.envato.com/files/351371/example_3.html">Example 3</a> <a style="outline-width: 0px; outline-style: initial; outline-color: initial; font-weight: inherit; font-style: inherit; font-size: 13px; font-family: inherit; vertical-align: baseline; text-decoration: none; color: #bb3e26; padding: 0px; margin: 0px; border: 0px initial initial;" href="http://s3.envato.com/files/351371/example_4.html">Example 4</a></p>
<p>Features:</p>
<ul>
<li>Auto slide</li>
<li>Continuous sliding</li>
<li>Image captions</li>
<li>Flexible configuration</li>
<li>6 Transitions effects</li>
</ul>
<p><a href="http://codecanyon.net/item/sexy-slider/87148?ref=1stwebdesigner"><img class="alignnone size-full wp-image-40842" title="sexy-slider-code" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/sexy-slider-code.jpg" alt="" width="570" height="300" /></a></p>
<p>15.2. <a href="http://malsup.com/jquery/cycle/" target="_blank">JQuery Cycle Plugin</a></p>
<p>The jQuery Cycle Plugin is a lightweight slideshow plugin.It supports pause-on-hover, auto-stop, auto-fit, before/after callbacks, click triggers and many transition effects. It also supports, but does not require, the Metadata Plugin and the Easing Plugin.</p>
<p><a href="http://malsup.com/jquery/cycle/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/cycle-jquery.jpg" border="0" alt="cycle-jquery" width="570" height="422" /></a></p>
<p>16. <a href="http://jqueryfordesigners.com/demo/slider-gallery.html" target="_blank">Slider Gallery</a></p>
<p>This &#8216;product slider&#8217; is similar to a straight forward gallery, except that there is a slider to navigate the items, i.e. the bit the user controls to view the items. Simple stuff using jQuery plugins.</p>
<p><a href="http://jqueryfordesigners.com/demo/slider-gallery.html" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/slider-gallery.jpg" border="0" alt="slider-gallery" width="570" height="175" /></a></p>
<p>17. <a href="http://www.no-margin-for-errors.com/projects/prettyPhoto/" target="_blank">PrettyPhoto</a></p>
<p>jQuery Lightbox clone, pretty similar to original Lightbox with few another features and full documentation.</p>
<p><a href="http://www.no-margin-for-errors.com/projects/prettyPhoto/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/prettyphoto.jpg" border="0" alt="prettyphoto" width="570" height="459" /></a></p>
<p>18. <a href="http://www.no-margin-for-errors.com/projects/prettyGallery/" target="_blank">PrettyGallery</a></p>
<p>One more way how to display Your photos using jQuery.</p>
<p><a href="http://www.no-margin-for-errors.com/projects/prettyGallery/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/prettygallery.jpg" border="0" alt="prettygallery" width="435" height="396" /></a></p>
<p>19. <a href="http://www.puidokas.com/portfolio/frogjs/" target="_blank">FrogJS</a></p>
<p>FrogJS is a simple, unobtrusive JavaScript gallery. It’s not a replacement for other thumbnail galleries like Lightbox JS, but a different way of showcasing galleries. This type of gallery is best used when a page-by-page gallery is needed, as is the case with photo stories.</p>
<p><a href="http://www.puidokas.com/portfolio/frogjs/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/frogjs.jpg" border="0" alt="frogjs" width="569" height="213" /></a></p>
<p>20. <a href="http://www.twospy.com/galleriffic/" target="_blank">Galleriffic</a></p>
<p>A jQuery plugin for rendering fast-performing photo galleries. Galleriffic was inspired by Mike Alsup&#8217;s Cycle plugin, but with performance in mind for delivering a high volume of photos.</p>
<p><a href="http://www.twospy.com/galleriffic/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/galleriffic.jpg" border="0" alt="galleriffic" width="569" height="298" /></a></p>
<p>21. <a href="http://designshack.co.uk/news/pirobox-jquery-lightbox" target="_blank">Pirobox jQuery Lightbox</a></p>
<p>Lightbox scripts have become a very popular way of displaying images online in recent months. There are a huge number of them available, using a variety of different frameworks and languages. DesignShack offers a new jQuery Lightbox script It has been designed and created by Diego Valobra.</p>
<p><a href="http://designshack.co.uk/news/pirobox-jquery-lightbox" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/pirobox.jpg" border="0" alt="pirobox" width="569" height="232" /></a></p>
<p>22. <a href="http://www.electricprism.com/aeron/slideshow/" target="_blank">Slideshow 2</a></p>
<p>Slideshow 2! is a JavaScript class for Mootools 1.2 to stream and animate the presentation of images on your website. This page features some examples of how Slideshow might be used to enhance the presentation of images on your website. Please view the source of this page for usage information.</p>
<p><a href="http://www.electricprism.com/aeron/slideshow/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/slideshow.jpg" border="0" alt="slideshow" width="570" height="536" /></a></p>
<p>23. <a href="http://ptflickrgallery.sourceforge.net/web/index.html" target="_blank">JQuery flickrGallery</a></p>
<p>FlickrGallery is a jQuery plugin for embedding flickr photos into a webpage.  Plugin considers a Gallery to be a list of Albums (similar to Flickr’s Collections).  Albums are considered to be photo sets.</p>
<p><a href="http://ptflickrgallery.sourceforge.net/web/index.html" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/jquery-flickr.jpg" border="0" alt="jquery-flickr" width="570" height="361" /></a></p>
<p>23.1. <a href="http://codecanyon.net/item/ddslider-10-transitions-inline-content-support/104797?ref=1stwebdesigner">DDSlider &#8211; 10 Transitions &#8211; Inline Content Support</a> ( <a href="http://codecanyon.net/item/ddslider-10-transitions-inline-content-support/full_screen_preview/104797?ref=1stwebdesigner">View Demo</a> &#8211; 10$)</p>
<p>DDSlider introduces a new easy-to-go slider with 9 different unique transitions (+fading &amp; random—11 total) that support Inline Content. You can also have multiple sliders in the same page.</p>
<p>Features:</p>
<ul>
<li>Inline Content Support</li>
<li>11 Different Unique Transitions</li>
<li>Support to all major browsers including IE6</li>
<li>Auto Play</li>
<li>Supports arrows and selectors</li>
<li>Choose arrows and selectors simply</li>
<li>Set the number of bars and squares</li>
</ul>
<p><a href="http://codecanyon.net/item/ddslider-10-transitions-inline-content-support/104797?ref=1stwebdesigner"><img class="alignnone size-full wp-image-40843" title="ddlisder-slideshow-code" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/ddlisder-slideshow-code.jpg" alt="" width="570" height="300" /></a><br />
<div id="adsenseads" style="margin:0 15px"><script type="text/javascript"><!--
							google_ad_client = "ca-pub-2552502674694369";
							google_ad_slot = "1448631891";
							google_ad_width = 300;
							google_ad_height = 250;
							//-->
							</script>
							<script type="text/javascript"
							src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
							</script><script type="text/javascript"><!--
				google_ad_client = "ca-pub-2538875746173404";
				/* 300x250, created 3/9/09 */
				google_ad_slot = "5916600540";
				google_ad_width = 300;
				google_ad_height = 250;
				//-->
				</script>
				<script type="text/javascript"
				src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
				</script></div><br />
24. <a href="http://scriptandstyle.com/automatically-generate-a-photo-gallery-from-a-directory-of-images" target="_blank">Auto Generating Gallery</a></p>
<p>Words &#8211; “Auto Generating” don’t mean that that it takes the pictures for you. This gallery won’t even create the thumbnails for you. What it DOES, is build itself dynamically from your directory of images. So when you want to add new photos, you simply drop the new photo and thumbnail in the directory and you are done! Removing photos just means removing the photos from the image directory. Gallery use PHP for this web wizardry.</p>
<p><a href="http://scriptandstyle.com/automatically-generate-a-photo-gallery-from-a-directory-of-images" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/auto-generating-gallery.jpg" border="0" alt="auto-generating-gallery" width="570" height="355" /></a></p>
<p>25. <a href="http://opiefoto.com/articles/photoslider#example" target="_blank">Photo Slider</a></p>
<p>Tutorial teaching how to create photo slider gallery with play/pause slideshow settings and interesting thumbnail effect using jQuery.</p>
<p><a href="http://opiefoto.com/articles/photoslider#example" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/photo-slider.jpg" border="0" alt="photo-slider" width="570" height="447" /></a></p>
<p>26. <a href="http://www.leigeber.com/2008/12/javascript-slideshow/" target="_blank">JavaScript TinySlideshow</a></p>
<p>This dynamic JavaScript slideshow is a lightweight (5kb) and free image gallery / slideshow script.</p>
<p>You can easily set it to auto-display the images, set the scroll speed, thumbnail opacity or to disable thumbnail slider.</p>
<p><a href="http://www.leigeber.com/2008/12/javascript-slideshow/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/javascrip-tinyslideshow.jpg" border="0" alt="javascrip-tinyslideshow" width="515" height="416" /></a></p>
<p>27. <a href="http://www.serie3.info/s3slider/index.php" target="_blank">S3Slider jQuery plugin</a></p>
<p>JQuery Slideshow with three different features and displaying sides, fully customizable sizes, delay speed and with good documentation.</p>
<p><a href="http://www.serie3.info/s3slider/index.php" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/s3slider-jquery.jpg" border="0" alt="s3slider-jquery" width="570" height="275" /></a></p>
<p>28. <a href="http://www.agilegallery.com/ajax-photo-gallery.html" target="_blank">Ajax Photo Gallery</a></p>
<p>The AJAX version of AgileGallery is a free <strong>AJAX photo gallery</strong> that rips through the XML output from <a href="http://picasa.google.com/">Picasa</a> (a free download from Google) and generates DHTML for the paging and thumbnails and displays the full sized photos along with any description entered in Picasa. Since this photo gallery uses AJAX technology, it eliminates the need for any page refresh as the user pages through the photos.</p>
<p><a href="http://www.agilegallery.com/ajax-photo-gallery.html" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/ajax-picassa.jpg" border="0" alt="ajax-picassa" width="570" height="364" /></a></p>
<p>29. <a href="http://mondaybynoon.com/2007/02/19/suckerfish-hoverlightbox-redux/" target="_blank">Suckerfish HoverLightbox Redux</a></p>
<p>Handy JavaScript, CSS based image gallery with another version of Lightbox included.</p>
<p><a href="http://mondaybynoon.com/2007/02/19/suckerfish-hoverlightbox-redux/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/suckerfish.jpg" border="0" alt="suckerfish" width="523" height="259" /></a></p>
<p>[ad#bildes-ads]<br />
30. <a href="http://www.phatfusion.net/slideshow/" target="_blank">PhatFusion Slideshow</a></p>
<p>Slideshow using JavaScript MooTools with features like:</p>
<ul>
<li>Fade, Slide and Wipe transitions</li>
<li>Loops</li>
<li>Play, Stop, Next and Previous controls</li>
<li>Inits from array of image src&#8217;s, a list of images on the page or using the href of an a tag like the Lightbox.</li>
</ul>
<p><a href="http://www.phatfusion.net/slideshow/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/phatfusion.jpg" border="0" alt="phatfusion" width="462" height="424" /></a></p>
<p>30.1. <a href="http://codecanyon.net/item/aviaslider-jquery-slideshow/105090?ref=1stwebdesigner">AviaSlider &#8211; jQuery Slideshow</a> (<a href="http://codecanyon.net/item/aviaslider-jquery-slideshow/full_screen_preview/105090?ref=1stwebdesigner">View Demo</a> &#8211; 12$)</p>
<p>AviaSlider is a very flexible and easy to use Image slideshow plugin for jQuery with a set of really unique transitions that were nver available before, as well as some basic transitions, so the slider will fit into every project.</p>
<p>It comes with an image preloader so the slider starts when images are ready to be shown. No clumsy animations with half loaded images.</p>
<p>Features of the Avia Image Slider</p>
<ul>
<li>8 unique transition effects</li>
<li>Lots of easy to set options to create your own effects</li>
<li>Included Image preloader</li>
<li>Autoplay that stops on user interaction</li>
<li>Valid HTML5 and CSS 3 Markup</li>
</ul>
<p><a href="http://codecanyon.net/item/aviaslider-jquery-slideshow/105090?ref=1stwebdesigner"><img class="alignnone size-full wp-image-40844" title="aviaslider-jquery-slideshow" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/aviaslider-jquery-slideshow.jpg" alt="" width="570" height="300" /></a></p>
<p>31. <a href="http://highslide.com/" target="_blank">HighSlide JS</a></p>
<p>Highslide JS is an open source JavaScript software, offering a Web 2.0 approach to popup windows. It streamlines the use of thumbnail images and HTML popup&#8217;s on web pages.</p>
<p><a href="http://highslide.com/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/highslide.jpg" border="0" alt="highslide" width="570" height="406" /></a></p>
<p>32. <a href="http://mediaeventservices.com/blog/2007/11/15/ajax-image-gallery-powered-by-slideflow-like-cover-flow/" target="_blank">SlideFlow Ajax Image Gallery</a></p>
<p>Use slideflow to show elegantly Your images, also fullscreen mode is available.</p>
<p>Technical background: The photos and titles are read from an XML file, and the thumbnails are pre-generated using Photoshop actions (included)</p>
<p><a href="http://mediaeventservices.com/blog/2007/11/15/ajax-image-gallery-powered-by-slideflow-like-cover-flow/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/ajax-image-gallery.jpg" border="0" alt="ajax-image-gallery" width="570" height="475" /></a></p>
<p>33. <a href="http://devthought.com/barackslideshow-an-elegant-lightweight-slideshow-script/" target="_blank">Barack Slideshow 0.2</a></p>
<p>An elegant, lightweight slideshow JavaScript script.</p>
<p><a href="http://devthought.com/barackslideshow-an-elegant-lightweight-slideshow-script/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/barackslideshow.jpg" border="0" alt="barackslideshow" width="570" height="358" /></a></p>
<p>34. <a href="http://www.mind-projects.it/projects/jqzoom/" target="_blank">jQZoom Evolution</a></p>
<p>JQZoom is a JavaScript image magnifier built at the top of the popular jQuery JavaScript framework. jQzoom is a great and a really easy to use script to magnify what you want.</p>
<p><a href="http://www.mind-projects.it/projects/jqzoom/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/jqzoom.jpg" border="0" alt="jqzoom" width="570" height="292" /></a></p>
<p>35. <a href="http://www.openstudio.fr/jQuery-Multimedia-Portfolio.html?lang=en" target="_blank">jQuery Multimedia Portfolio</a></p>
<p>This plugin for jQuery will automatically detect the extension of each media and apply the adapted player.</p>
<p><a href="http://www.openstudio.fr/jQuery-Multimedia-Portfolio.html?lang=en" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/multimedia-portfolio.jpg" border="0" alt="multimedia-portfolio" width="570" height="190" /></a></p>
<p>36. <a href="http://www.openstudio.fr/jQuery-spherical-panorama-viewer.html?lang=en" target="_blank">jQuery spherical panorama viewer</a></p>
<p>A JavaScript viewer for displaying spherical panoramas. An alternative to Java and QuickTime technology.</p>
<p>I didn&#8217;t include screenshot here because demonstration can be seen only by clicking and dragging on the picture getting that 3D look.</p>
<p>37. <a href="http://www.openstudio.fr/jQuery-virtual-tour.html?lang=en" target="_blank">JQuery Virtual Tour</a></p>
<p>This is an extension to the simple panorama viewer that allows you to play a little bit more with jQuery by adding interactivity to transform some panoramic views into a virtual tour !</p>
<p><a href="http://www.openstudio.fr/jQuery-virtual-tour.html?lang=en" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/jquery-virtual-tour.jpg" border="0" alt="jquery-virtual-tour" width="570" height="369" /></a></p>
<p>38. <a href="http://www.artviper.net/test/ajaxslide/index2.html" target="_blank">MooSlideBox</a></p>
<p>The mooSlideBox v3 is a small and slim Ajax based extension or replacement of the common &#8220;Lightbox&#8221; that can be found on nearly every page. This Lightbox clone works in IE 6/7, Opera and Firefox. It is based on the MooTools framework version 1.11.</p>
<p><a href="http://www.artviper.net/test/ajaxslide/index2.html" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/mooslide.jpg" border="0" alt="mooslide" width="570" height="236" /></a></p>
<p>39. <a href="http://benjaminsterling.com/jquery-jqgalscroll-photo-gallery/" target="_blank">jqGalScroll</a></p>
<p>jQuery Gallery Scroller (jqGalScroll) takes list of images and creates a smooth scrolling photo gallery scrolling vertically, horizontally, or diagonally. The plugin will also create pagination to allow you to flow through your photos</p>
<p><a href="http://benjaminsterling.com/jquery-jqgalscroll-photo-gallery/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/jqgal.jpg" border="0" alt="jqgal" width="570" height="343" /></a></p>
<p>40. <a href="http://css-tricks.com/creating-a-slick-auto-playing-featured-content-slider/" target="_blank">Featured Content Slider</a></p>
<p>Tutorial, how to create a slick auto-playing featured content slider.</p>
<p><a href="http://css-tricks.com/creating-a-slick-auto-playing-featured-content-slider/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/featured-content.jpg" border="0" alt="featured-content" width="498" height="403" /></a></p>
<p>41. <a href="http://cssglobe.com/post/3783/jquery-plugin-easy-image-or-content-slider" target="_blank">Easy Slider jQuery Plugin</a></p>
<p><strong>Easy Slider</strong> enables images or any content to slide horizontally or vertically on click. It is configurable with CSS alone. So, basically you link to plugin file, set the content up and style it with CSS.</p>
<p><a href="http://cssglobe.com/post/3783/jquery-plugin-easy-image-or-content-slider" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/easy-slider-jquery.jpg" border="0" alt="easy-slider-jquery" width="570" height="287" /></a></p>
<p>42. <a href="http://www.leigeber.com/2008/05/ajax-image-gallery-slideshow/" target="_blank">Dynamic Image Gallery and Slideshow</a></p>
<p>This extremely lightweight JavaScript image gallery and slideshow script clocks in under 3kb packed and includes a number of cool features.</p>
<p><a href="http://www.leigeber.com/2008/05/ajax-image-gallery-slideshow/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/dynamic-gallery.jpg" border="0" alt="dynamic-gallery" width="570" height="436" /></a></p>
<h2>CSS Based Galleries</h2>
<p>43. <a href="http://sonspring.com/journal/hoverbox-image-gallery" target="_blank">HoverBox Image Gallery</a></p>
<p>Basically, it’s a super light-weight (8kb) roll-over photo gallery that uses nothing but CSS, free to use for Your own projects.</p>
<p><a href="http://sonspring.com/journal/hoverbox-image-gallery" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/hoverbox-image-gallery.jpg" border="0" alt="hoverbox-image-gallery" width="570" height="388" /></a></p>
<p>44. <a href="http://www.cssplay.co.uk/menu/gallery3l.html" target="_blank">Sliding Photograph Galleries</a></p>
<p>This gallery is my simplest yet. It is just an unordered list of images that are normally compressed vertically (reduction 8:1). When you hover over one of these compressed images it expands to full size. It is based on my sliding menu system and adapted to use images. No thumbnails are required and all the images are &#8216;pre-loaded&#8217;.This method can be used either vertically, as shown, or horizontally.</p>
<p><a href="http://www.cssplay.co.uk/menu/gallery3l.html" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/sliding-photo-gallery-css.jpg" border="0" alt="sliding-photo-gallery-css" width="498" height="243" /></a></p>
<p>45. <a href="http://www.dynamicdrive.com/style/csslibrary/item/css-image-gallery/" target="_blank">CSS Image Gallery</a></p>
<p>This is a purely CSS based image gallery that displays larger versions of thumbnail images dynamically when the mouse hovers over them. A rich HTML caption can be added to the enlarged image, and every aspect of the Image Gallery exists as plain HTML on the page. The gallery works in IE6+, Firefox, Opera 8+.</p>
<p><a href="http://www.dynamicdrive.com/style/csslibrary/item/css-image-gallery/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/css-image-gallery.jpg" border="0" alt="css-image-gallery" width="570" height="297" /></a></p>
<p>46. <a href="http://www.cssplay.co.uk/menu/slide_show.html" target="_blank">Cross browser CSS Slideshow</a></p>
<p>Nasty CSS Slideshow producing a slide show or photogallery using a mixture of portrait and landscape images.</p>
<p><a href="http://www.cssplay.co.uk/menu/slide_show.html" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/crossbrowser-css-slideshow.jpg" border="0" alt="crossbrowser-css-slideshow" width="570" height="413" /></a></p>
<p>47. <a href="http://www.cssplay.co.uk/menu/lightbox.html" target="_blank">Cross Browser Multi-Page Photograph Gallery</a></p>
<p>Based on the look of Suckerfish HoverLightbox, this one uses my multi-page layout system but includes images instead of text.Unlike the Suckerfish HoverLightbox this version does not use JavaScript but is pure CSS and still works in IE.</p>
<p>Tested in IE5.5, IE6, IE7, Opera, Firefox, Safari (PC).</p>
<p><a href="http://www.cssplay.co.uk/menu/lightbox.html" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/cross-browser-multi.jpg" border="0" alt="cross-browser-multi" width="570" height="480" /></a></p>
<p>48. <a href="http://www.webdesignerwall.com/tutorials/css-decorative-gallery/" target="_blank">CSS Decorative Gallery</a></p>
<p>Nice CSS Decorative Gallery and tutorial, how to decorate your images and photo galleries without editing the source images.</p>
<p><a href="http://www.webdesignerwall.com/tutorials/css-decorative-gallery/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/css-decorative-gallery.jpg" border="0" alt="css-decorative-gallery" width="570" height="483" /></a></p>
<h2>Flash Based Galleries</h2>
<p>49. <a href="http://www.webdesignerwall.com/tutorials/parallax-gallery/" target="_blank">Flash Parallax Gallery</a></p>
<p>Parallax scrolling is frequently used in most 2D animation and games, where the background images and foreground images scroll at different rate of speed. This will create an illusion of depth as the background images are moving slower than the foreground images. Awesome tutorial and also great idea how to display Your portfolio or create unique web design. Must see!</p>
<p><a href="http://www.webdesignerwall.com/tutorials/parallax-gallery/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/parallax.jpg" border="0" alt="parallax" width="570" height="366" /></a></p>
<p>50. <a href="http://www.flash-gallery.org/" target="_blank">Flash Gallery</a></p>
<p>Flash Gallery is a free application that allows you to create a slideshow on your website easy and fast. You won&#8217;t need any programming skills to install or use it. Just embed it into your website and script will automatically form a slideshow from a specified folder or from Flickr photostream.</p>
<p><a href="http://www.flash-gallery.org/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/flash-gallery.jpg" border="0" alt="flash-gallery" width="570" height="388" /></a></p>
<p>51. <a href="http://www.airtightinteractive.com/simpleviewer/" target="_blank">SimpleViewer</a></p>
<p>SimpleViewer is a free, customizable Flash image viewing application.</p>
<p><a href="http://www.airtightinteractive.com/simpleviewer/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/simpleviewer.jpg" border="0" alt="simpleviewer" width="570" height="292" /></a></p>
<p>52. <a href="http://www.flashmo.com/preview/flashmo_098_3d_curve_wall" target="_blank">3D Curve Wall</a></p>
<p>Unique Flash based 3D curve wall similar to Flashloaded version, but this one is free.</p>
<p><a href="http://www.flashmo.com/preview/flashmo_098_3d_curve_wall" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/3dcurve-wall.jpg" border="0" alt="3dcurve-wall" width="570" height="321" /></a></p>
<p>53. <a href="http://www.dezinerfolio.com/2007/06/07/dfgallery/" target="_blank">dfGallery</a></p>
<p>As stated on many other articles on DezinerFolio site, dfGallery is one of the coolest flash galleries currently on the Web.</p>
<p><a href="http://www.dezinerfolio.com/2007/06/07/dfgallery/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/dfgallery.jpg" border="0" alt="dfgallery" width="570" height="259" /></a></p>
<p>54. <a href="http://www.flashmo.com/preview/flashmo_094_spiral_carousel_xml" target="_blank">Spiral Carrousel XML</a></p>
<p><a href="http://www.flashmo.com/preview/flashmo_094_spiral_carousel_xml" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/spiral-carousel.jpg" border="0" alt="spiral-carousel" width="570" height="266" /></a></p>
<p>55. <a href="http://www.no3dfx.com/polaroid/" target="_blank">Polaroid Gallery</a></p>
<p>Polaroid Gallery is a free, opensource flash gallery, the script loads images and image titles dynamically from an external XML file or a flickr RSS feed. Then the script processes the data and creates an interactive flash gallery.</p>
<p><a href="http://www.no3dfx.com/polaroid/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/polaroid-gallery.jpg" border="0" alt="polaroid-gallery" width="570" height="464" /></a></p>
<p>56. <a href="http://www.airtightinteractive.com/projects/tiltviewer/" target="_blank">TiltViewer</a></p>
<p>TiltViewer is a free, customizable 3D Flash image viewing application.</p>
<p><a href="http://www.airtightinteractive.com/projects/tiltviewer/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/tiltviewer.jpg" border="0" alt="tiltviewer" width="570" height="360" /></a></p>
<p>57. <a href="http://www.huddletogether.com/projects/lightbox2/" target="_blank">Lightbox 2</a></p>
<p>Lightbox is a simple, unobtrusive script used to overlay images on the current page. It&#8217;s a snap to setup and works on all modern browsers</p>
<p><a href="http://www.huddletogether.com/projects/lightbox2/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/lightbox-2.jpg" border="0" alt="lightbox-2" width="570" height="323" /></a></p>
<h2>Other</h2>
<p>57+. <a href="http://www.dynamicdrive.com/dynamicindex4/" target="_blank">DynamicDrive</a></p>
<p>And finally if You still haven&#8217;t got enough galleries or one for Your taste You can check this huge collection of many different image galleries from DynamicDrive.com</p>
<p><a href="http://www.dynamicdrive.com/dynamicindex4/" target="_blank"><img style="border-width: 0px;" src="http://cdn1.1stwebdesigner.com/wp-content/uploads/2009/01/dynamic-drive.jpg" border="0" alt="dynamic-drive" width="274" height="55" /></a></p>
<p>If You know some more resources I missed here, feel free to add in comments and if You enjoy this article, let others know about it! Spread the word!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.1stwebdesigner.com/css/57-free-image-gallery-slideshow-and-lightbox-solutions/feed/</wfw:commentRss>
		<slash:comments>277</slash:comments>
		</item>
	</channel>
</rss>

