<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.1/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css"> <link rel="stylesheet" href="http://blueimp.github.io/Gallery/css/blueimp-gallery.min.css"> <link rel="stylesheet" href="https://raw.github.com/blueimp/Bootstrap-Image-Gallery/master/css/bootstrap-image-gallery.css"> <link rel="stylesheet" href="https://raw.github.com/blueimp/Bootstrap-Image-Gallery/master/css/demo.css"> <div class="container"> <!-- The container for the list of example images --> <div id="links"> <a data-gallery="" title="Natalia" href="http://farm4.static.flickr.com/3741/11188919165_b73f1ddc32_b.jpg"> <img src="http://farm4.static.flickr.com/3741/11188919165_b73f1ddc32_s.jpg"> </a> <a data-gallery="" title="Delft Touch in the kitchen" href="http://farm4.static.flickr.com/3812/11188050815_5e8cccf0f6_b.jpg"> <img src="http://farm4.static.flickr.com/3812/11188050815_5e8cccf0f6_s.jpg"> </a> <a data-gallery="" title="Father Figure Project: The Social Construct" href="http://farm4.static.flickr.com/3703/11191153143_04bbbc8301_b.jpg"> <img src="http://farm4.static.flickr.com/3703/11191153143_04bbbc8301_s.jpg"> </a> <a data-gallery="" title="Higherbeams." href="http://farm4.static.flickr.com/3821/11190956343_09b8022ea2_b.jpg"> <img src="http://farm4.static.flickr.com/3821/11190956343_09b8022ea2_s.jpg"> </a> <a data-gallery="" title="Contact" href="http://farm8.static.flickr.com/7325/11186917235_003d9df5d6_b.jpg"> <img src="http://farm8.static.flickr.com/7325/11186917235_003d9df5d6_s.jpg"> </a> <a data-gallery="" title="The Track" href="http://farm6.static.flickr.com/5501/11186913445_c88dd25c59_b.jpg"> <img src="http://farm6.static.flickr.com/5501/11186913445_c88dd25c59_s.jpg"> </a> <a data-gallery="" title="TheHallsOfAdoration" href="http://farm4.static.flickr.com/3715/11186895035_8596236621_b.jpg"> <img src="http://farm4.static.flickr.com/3715/11186895035_8596236621_s.jpg"> </a> <a data-gallery="" title="Si me dijeran pide un deseo" href="http://farm8.static.flickr.com/7414/11190086653_e330723a8c_b.jpg"> <img src="http://farm8.static.flickr.com/7414/11190086653_e330723a8c_s.jpg"> </a> <a data-gallery="" title="untitled" href="http://farm3.static.flickr.com/2891/11188743634_f339e72b79_b.jpg"> <img src="http://farm3.static.flickr.com/2891/11188743634_f339e72b79_s.jpg"> </a> <a data-gallery="" title="Loch Ba" href="http://farm8.static.flickr.com/7390/11187408694_9dd7188ca8_b.jpg"> <img src="http://farm8.static.flickr.com/7390/11187408694_9dd7188ca8_s.jpg"> </a> <a data-gallery="" title="Remarkable Rocks 2" href="http://farm3.static.flickr.com/2831/11187401055_1e498bde13_b.jpg"> <img src="http://farm3.static.flickr.com/2831/11187401055_1e498bde13_s.jpg"> </a> <a data-gallery="" title="The imagination tree" href="http://farm6.static.flickr.com/5530/11188853224_91ebabac12_b.jpg"> <img src="http://farm6.static.flickr.com/5530/11188853224_91ebabac12_s.jpg"> </a> <a data-gallery="" title="Blue Patricia Lake" href="http://farm4.static.flickr.com/3720/11190734053_7cf9749bdb_b.jpg"> <img src="http://farm4.static.flickr.com/3720/11190734053_7cf9749bdb_s.jpg"> </a> <a data-gallery="" title="Goblin Brute" href="http://farm4.static.flickr.com/3740/11186937956_d8d8422169_b.jpg"> <img src="http://farm4.static.flickr.com/3740/11186937956_d8d8422169_s.jpg"> </a> <a data-gallery="" title="." href="http://farm8.static.flickr.com/7421/11191341825_b2bf635f25_b.jpg"> <img src="http://farm8.static.flickr.com/7421/11191341825_b2bf635f25_s.jpg"> </a> <a data-gallery="" title="be the light 336.365" href="http://farm3.static.flickr.com/2809/11189301843_9f41b02a47_b.jpg"> <img src="http://farm3.static.flickr.com/2809/11189301843_9f41b02a47_s.jpg"> </a> <a data-gallery="" title="Lofoten Islands" href="http://farm4.static.flickr.com/3788/11193226453_fd9b06008c_b.jpg"> <img src="http://farm4.static.flickr.com/3788/11193226453_fd9b06008c_s.jpg"> </a> <a data-gallery="" title="もみじ" href="http://farm4.static.flickr.com/3737/11189043544_e992a227d3_b.jpg"> <img src="http://farm4.static.flickr.com/3737/11189043544_e992a227d3_s.jpg"> </a> <a data-gallery="" title="Nocturna en Albarracín./ Nocturne near Albarracín (Teruel, Spain)." href="http://farm8.static.flickr.com/7455/11187819606_c008b36106_b.jpg"> <img src="http://farm8.static.flickr.com/7455/11187819606_c008b36106_s.jpg"> </a> <a data-gallery="" title="DIAMOND IN THE ROUGH" href="http://farm8.static.flickr.com/7319/11188792234_dfea30f688_b.jpg"> <img src="http://farm8.static.flickr.com/7319/11188792234_dfea30f688_s.jpg"> </a> <a data-gallery="" title="Imperfection" href="http://farm3.static.flickr.com/2817/11188666563_091e4bb4b4_b.jpg"> <img src="http://farm3.static.flickr.com/2817/11188666563_091e4bb4b4_s.jpg"> </a> <a data-gallery="" title="Late Again" href="http://farm6.static.flickr.com/5531/11186088035_98d5c7be84_b.jpg"> <img src="http://farm6.static.flickr.com/5531/11186088035_98d5c7be84_s.jpg"> </a> <a data-gallery="" title="Canyons" href="http://farm6.static.flickr.com/5502/11189048145_f234c1c4a1_b.jpg"> <img src="http://farm6.static.flickr.com/5502/11189048145_f234c1c4a1_s.jpg"> </a> <a data-gallery="" title="Brouillard sur Lanaud" href="http://farm6.static.flickr.com/5477/11193030495_dc7d99caff_b.jpg"> <img src="http://farm6.static.flickr.com/5477/11193030495_dc7d99caff_s.jpg"> </a> <a data-gallery="" title="Incontri di lavoro" href="http://farm8.static.flickr.com/7333/11189762165_7092588e1f_b.jpg"> <img src="http://farm8.static.flickr.com/7333/11189762165_7092588e1f_s.jpg"> </a> <a data-gallery="" title="Tijdens de wandeling terug van De panne naar Oostduinkerke" href="http://farm6.static.flickr.com/5542/11186573045_89102139d2_b.jpg"> <img src="http://farm6.static.flickr.com/5542/11186573045_89102139d2_s.jpg"> </a> <a data-gallery="" title="absorbed" href="http://farm4.static.flickr.com/3751/11194208465_ccfb0df6d3_b.jpg"> <img src="http://farm4.static.flickr.com/3751/11194208465_ccfb0df6d3_s.jpg"> </a> <a data-gallery="" title="Metal, Steam and Dedication. North Yorkshire Moors Railway." href="http://farm6.static.flickr.com/5531/11189794436_99c1e0dcfd_b.jpg"> <img src="http://farm6.static.flickr.com/5531/11189794436_99c1e0dcfd_s.jpg"> </a> <a data-gallery="" title="Tutorial tuesday" href="http://farm4.static.flickr.com/3767/11194056215_786a05dcb9_b.jpg"> <img src="http://farm4.static.flickr.com/3767/11194056215_786a05dcb9_s.jpg"> </a> <a data-gallery="" title="My Street." href="http://farm8.static.flickr.com/7375/11187509905_0366640771_b.jpg"> <img src="http://farm8.static.flickr.com/7375/11187509905_0366640771_s.jpg"> </a> <a data-gallery="" title="Histoire comme ça" href="http://farm3.static.flickr.com/2821/11187333644_25ae318b9a_b.jpg"> <img src="http://farm3.static.flickr.com/2821/11187333644_25ae318b9a_s.jpg"> </a> <a data-gallery="" title="" href="http://farm4.static.flickr.com/3797/11186343795_9e20e0a0d0_b.jpg"> <img src="http://farm4.static.flickr.com/3797/11186343795_9e20e0a0d0_s.jpg"> </a> <a data-gallery="" title="Alice" href="http://farm6.static.flickr.com/5501/11190429845_6b3bf13263_b.jpg"> <img src="http://farm6.static.flickr.com/5501/11190429845_6b3bf13263_s.jpg"> </a> <a data-gallery="" title="Irreversible" href="http://farm8.static.flickr.com/7437/11188139865_91b1fbb522_b.jpg"> <img src="http://farm8.static.flickr.com/7437/11188139865_91b1fbb522_s.jpg"> </a> <a data-gallery="" title="Kurhaus Binz" href="http://farm8.static.flickr.com/7311/11194373534_956b5e79d9_b.jpg"> <img src="http://farm8.static.flickr.com/7311/11194373534_956b5e79d9_s.jpg"> </a> </div> <br> </div> <!-- The Bootstrap Image Gallery lightbox, should be a child element of the document body --> <div id="blueimp-gallery" class="blueimp-gallery"> <!-- The container for the modal slides --> <div class="slides"></div> <!-- Controls for the borderless lightbox --> <h3 class="title"></h3> <a class="prev">‹</a> <a class="next">›</a> <a class="close">×</a> <a class="play-pause"></a> <ol class="indicator"></ol> <!-- The modal dialog, which will be used to wrap the lightbox content --> <div class="modal fade"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" aria-hidden="true">×</button> <h4 class="modal-title"></h4> </div> <div class="modal-body next"></div> <div class="modal-footer"> <button type="button" class="btn btn-default pull-left prev"> <i class="glyphicon glyphicon-chevron-left"></i> Previous </button> <button type="button" class="btn btn-primary next"> Next <i class="glyphicon glyphicon-chevron-right"></i> </button> </div> </div> </div> </div> </div> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <!-- Bootstrap JS is not required, but included for the responsive demo navigation and button states --> <script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.2/js/bootstrap.min.js"></script> <script src="http://blueimp.github.io/Gallery/js/jquery.blueimp-gallery.min.js"></script> <script src="https://raw.github.com/blueimp/Bootstrap-Image-Gallery/master/js/bootstrap-image-gallery.js"></script> <script src="https://raw.github.com/blueimp/Bootstrap-Image-Gallery/master/js/demo.js"></script>