Full version: jsB@nk » Framework » jQuery » Picture Gallery with Display Switcher
URL: https://www.javascriptbank.com/picture-gallery-with-display-switcher.html
This is really very cool and amazing picture gallery to promote your personal/business pictures on the web. With two type of displaying, this JavaScript gallery script allow users to switch the layout of gallery into thumbnail preview or listing scene.Try more picture gallery JavaScript on jsB@nk if you still need: - 16 Free Picture Slideshow Gallery scripts - JaS Gallery - Next-Previous Image Gallery
Full version: jsB@nk » Framework » jQuery » Picture Gallery with Display Switcher
URL: https://www.javascriptbank.com/picture-gallery-with-display-switcher.html
<style type="text/css">body {margin: 0;padding: 50px 0 0;font: 10px normal Verdana, Arial, Helvetica, sans-serif;color: #fff;}* {margin: 0;padding: 0;}img {border: none;}h1 {font: 5em normal Georgia, 'Times New Roman', Times, serif;text-align:center;margin-bottom: 20px;}h1 span { color: #e7ff61; }h1 small{font: 0.2em normal Verdana, Arial, Helvetica, sans-serif;text-transform:uppercase;letter-spacing: 1.5em;display: block;color: #ccc;}.container {width: 758px;margin: 0 auto;padding-bottom: 100px;overflow: hidden;}ul.display {float: left;width: 756px;margin: 0;padding: 0;list-style: none;border-top: 1px solid #333;border-right: 1px solid #333;background: #222;}ul.display li {float: left;width: 754px;padding: 10px 0;margin: 0;border-top: 1px solid #111;border-right: 1px solid #111;border-bottom: 1px solid #333;border-left: 1px solid #333;}ul.display li a {color: #e7ff61;text-decoration: none;}ul.display li .content_block {padding: 0 10px;}ul.display li .content_block h2 {margin: 0;padding: 5px;font-weight: normal;font-size: 1.7em;}ul.display li .content_block p {margin: 0;padding: 5px 5px 5px 245px;font-size: 1.2em;}ul.display li .content_block a img{padding: 5px;border: 2px solid #ccc;background: #fff;margin: 0 15px 0 0;float: left;}ul.thumb_view li{width: 250px;}ul.thumb_view li h2 {display: inline;}ul.thumb_view li p{display: none;}ul.thumb_view li .content_block a img {margin: 0 0 10px;}a.switch_thumb {width: 122px;height: 26px;line-height: 26px;padding: 0;margin: 10px 0;display: block;background: url(switch.gif) no-repeat;outline: none;text-indent: -9999px;}a:hover.switch_thumb {filter:alpha(opacity=75);opacity:.75;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";}a.swap { background-position: left bottom; }</style><script type="text/javascript" src="/javascript/jquery.js"></script><script type="text/javascript">$(document).ready(function(){ $("a.switch_thumb").toggle(function(){ $(this).addClass("swap"); $("ul.display").fadeOut("fast", function() { $(this).fadeIn("fast").addClass("thumb_view"); }); }, function () { $(this).removeClass("swap"); $("ul.display").fadeOut("fast", function() { $(this).fadeIn("fast").removeClass("thumb_view");});}); });</script><a href="javascript:void(0);" class="switch_thumb">Switch Thumb</a> <ul style="display: block;" class="display"><li><div class="content_block"><a href="#"><img src="sample.gif" alt=""></a><h2><a href="#">Image Name</a></h2><p>Askin',jehosephat come pudneer, sam-hell, in lament had. Cabin tax-collectorsspell, chitlins spittin' watchin' hootch me rightly kinfolk that. Womankickin', work yer last dogs, rattler hee-haw mobilehome stew trailerdriveway shootin'. </p></div></li><li><div class="content_block"><a href="#"><img src="sample2.gif" alt=""></a><h2><a href="#">Image Name</a></h2><p>Askin',jehosephat come pudneer, sam-hell, in lament had. Cabin tax-collectorsspell, chitlins spittin' watchin' hootch me rightly kinfolk that. Womankickin', work yer last dogs, rattler hee-haw mobilehome stew trailerdriveway shootin'. </p></div></li><li><div class="content_block"><a href="#"><img src="sample3.gif" alt=""></a><h2><a href="#">Image Name</a></h2><p>Askin',jehosephat come pudneer, sam-hell, in lament had. Cabin tax-collectorsspell, chitlins spittin' watchin' hootch me rightly kinfolk that. Womankickin', work yer last dogs, rattler hee-haw mobilehome stew trailerdriveway shootin'. </p></div></li><li><div class="content_block"><a href="#"><img src="sample4.gif" alt=""></a><h2><a href="#">Image Name</a></h2><p>Askin',jehosephat come pudneer, sam-hell, in lament had. Cabin tax-collectorsspell, chitlins spittin' watchin' hootch me rightly kinfolk that. Womankickin', work yer last dogs, rattler hee-haw mobilehome stew trailerdriveway shootin'. </p></div></li><li><div class="content_block"><a href="#"><img src="sample5.gif" alt=""></a><h2><a href="#">Image Name</a></h2><p>Askin',jehosephat come pudneer, sam-hell, in lament had. Cabin tax-collectorsspell, chitlins spittin' watchin' hootch me rightly kinfolk that. Womankickin', work yer last dogs, rattler hee-haw mobilehome stew trailerdriveway shootin'. </p></div></li><li><div class="content_block"><a href="#"><img src="sample6.gif" alt=""></a><h2><a href="#">Image Name</a></h2><p>Askin',jehosephat come pudneer, sam-hell, in lament had. Cabin tax-collectorsspell, chitlins spittin' watchin' hootch me rightly kinfolk that. Womankickin', work yer last dogs, rattler hee-haw mobilehome stew trailerdriveway shootin'. </p></div></li><li><div class="content_block"><a href="#"><img src="sample7.gif" alt=""></a><h2><a href="#">Image Name</a></h2><p>Askin',jehosephat come pudneer, sam-hell, in lament had. Cabin tax-collectorsspell, chitlins spittin' watchin' hootch me rightly kinfolk that. Womankickin', work yer last dogs, rattler hee-haw mobilehome stew trailerdriveway shootin'. </p></div></li><li><div class="content_block"><a href="#"><img src="sample8.gif" alt=""></a><h2><a href="#">Image Name</a></h2><p>Askin',jehosephat come pudneer, sam-hell, in lament had. Cabin tax-collectorsspell, chitlins spittin' watchin' hootch me rightly kinfolk that. </p></div></li><li><div class="content_block"><a href="#"><img src="sample9.gif" alt=""></a><h2><a href="#">Image Name</a></h2><p>Askin',jehosephat come pudneer, sam-hell, in lament had. Cabin tax-collectorsspell, chitlins spittin' watchin' hootch me rightly kinfolk that. Womankickin', work yer last dogs, rattler hee-haw mobilehome stew trailerdriveway shootin'. Woman kickin', work yer last dogs, rattler hee-hawmobilehome stew trailer driveway shootin'.</p></div></li><li><div class="content_block"><a href="#"><img src="sample10.gif" alt=""></a><h2><a href="#">Image Name</a></h2><p>Askin',jehosephat come pudneer, sam-hell, in lament had. Cabin tax-collectorsspell, chitlins spittin' watchin' hootch me rightly kinfolk that. Womankickin', work yer last dogs, rattler hee-haw mobilehome stew trailerdriveway shootin'. </p></div></li><li><div class="content_block"><a href="#"><img src="sample11.gif" alt=""></a><h2><a href="#">Image Name</a></h2><p>Askin', jehosephat come pudneer, sam-hell, in lament had. Cabin tax-collectors spell. </p></div></li><li><div class="content_block"><a href="#"><img src="sample12.gif" alt=""></a><h2><a href="#">Image Name</a></h2><p>Askin',jehosephat come pudneer, sam-hell, in lament had. Cabin tax-collectorsspell, chitlins spittin' watchin' hootch me rightly kinfolk that. Womankickin', work yer last dogs, rattler hee-haw mobilehome stew trailerdriveway shootin'. </p></div></li></ul>
/javascript/framework/Picture_Gallery_with_Display_Switcher/Picture Gallery with Display Switcher_images.zip