Full version: jsB@nk » Project » Single Responsive Photo Gallery plus Slideshow
URL: https://www.javascriptbank.com/single-responsive-photo-gallery-plus-slideshow.html
Currently, there are many JavaScript photo slideshow scripts, jQuery picture showcase plugins to make your own web galleries, I checked many scripts on the lists JavaScriptBank.com presented: - 65 Free JavaScript Photo Gallery Solutions - More 30 Excellent JavaScript/AJAX based Photo Galleries to Boost your Sites - 16 Free Picture Slideshow Gallery scriptsBut none of them satisfy my needs, I want to make the gallery to show many pictures of my son that's simple to load but can work on many screen sizes of PCs, laptops, tablets and smartphones. So this is the reason I created this JavaScript plugin.And now I'm happy to share this JavaScript project to everyone that may need. Basically, this JavaScript is very easy to install, use and customize. Just download the package, then fill your photo data and run.
Full version: jsB@nk » Project » Single Responsive Photo Gallery plus Slideshow
URL: https://www.javascriptbank.com/single-responsive-photo-gallery-plus-slideshow.html
<link rel="stylesheet" type="text/css" href="srpgs.css"/>
<script type="text/javascript" src="jquery-1.4.3.min.js"></script><script type="text/javascript" src="srpgs.js"></script><script type="text/javascript">/** Project:Single Responsive Photo Gallery plus Slideshow* Author:Phong Thai (http://www.javascriptbank.com/)* Support:http://www.javascriptbank.com/* Version:1.0*//*You are free to use this plugin in any personal, commercial project without my permission.But please help me by leaving the Copyright sign, it just occupies about 10 pixels, otherwise please help me with a milk coffee (paypal) to remove this sign.*/var srpgs_slideshowSpeed = 5000,// speed of the automatic slideshowsrpgs_scroll_delay = 700,// speed of the scrolling controlssrpgs_path_pics = 'pics/';// path to large photossrpgs_path_thumb = 'pics/thumbnails/';var srpgs_photos = [ {"image" : "srpgs-01.jpg"}, {"image" : "srpgs-02.jpg"}, {"image" : "srpgs-03.jpg"}, {"title" : "Title of Photo #04","image" : "srpgs-04.jpg","url" : "http://www.yoursite.com/photo-set-01/","subject" : "#04 in Subject of Set #1"}, {"title" : "Title of Photo #05","image" : "srpgs-05.jpg","url" : "http://www.yoursite.com/photo-set-01/","subject" : "#05 in Subject of Set #1"}, {"title" : "Title of Photo #06","image" : "srpgs-06.jpg","url" : "http://www.yoursite.com/photo-set-02/","subject" : "Subject of Set #2: Photo #06"}, {"title" : "","image" : "srpgs-07.jpg","url" : "","subject" : ""}, {"title" : "Title of Photo #08","image" : "srpgs-08.jpg","url" : "http://www.yoursite.com/photo-set-02/","subject" : "Subject of Set #2: Photo #08"}, {"image" : "srpgs-09.jpg"}, {"image" : "srpgs-10.jpg"}, {"image" : "srpgs-11.jpg"}, {"image" : "srpgs-12.jpg"}, {"image" : "srpgs-13.jpg"}, {"image" : "srpgs-14.jpg"}, {"image" : "srpgs-15.jpg"}, {"image" : "srpgs-16.jpg"}, {"image" : "srpgs-17.jpg"}, {"image" : "srpgs-18.jpg"}];</script><div class="srpgs-container"><!-- Photo placeholders --><div id="srpgs-slideshow"><div id="srpgs-rotate-1" class="srpgs-holder"><img src="" /></div><div id="srpgs-rotate-2" class="srpgs-holder"><img src="" /></div></div><!-- Photo slideshow controls --><div id="srpgs-control"><div class="srpgs-thumbs-nav copyright"><a href="http://www.javascriptbank.com" title="Copyright 2013">+</a></div><div class="srpgs-thumbs-nav up"></div><div id="srpgs-thumbs-gallery"></div><div class="srpgs-thumbs-nav down"></div><div id="srpgs-control-btns"><div id="srpgs-control-back"></div><div id="srpgs-control-play-pause"></div><div id="srpgs-control-next"></div></div></div><!-- Titles and subjects of the photos --><div id="srpgs-picture"><span id="srpgs-picture-title"></span><p class="srpgs-picture-link">In: <a href="#" id="srpgs-picture-url"></a></p></div></div>