onizuka17

<h2>First gallery:</h2>

  <div class="my-gallery" itemscope itemtype="http://schema.org/ImageGallery">

    <figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
      <a href="https://farm3.staticflickr.com/2567/5697107145_a4c2eaa0cd_o.jpg" itemprop="contentUrl" data-size="1024x1024">
          <img src="https://farm3.staticflickr.com/2567/5697107145_3c27ff3cd1_m.jpg" itemprop="thumbnail" alt="Image description" />
      </a>
                                          <figcaption itemprop="caption description">Image caption  1</figcaption>
                                          

onizuka17

<h1>   
  <a title="swiper.js" href="http://idangero.us/swiper/" target="_blank">Swiper.js (4.3.5)</a>
  & 
  <a title="photoswipe" href="http://photoswipe.com/" target="_blank">Photoswipe.js (4.1.1)</a> 
  - Mobile Native feel slider gallery 
</h1>
<p>Combine two of the most powerfull JS plugins (Endless options / Great docs / Fast / Modern / Mobile freindly) - <a title="swiper.js" href="http://idangero.us/swiper/" target="_blank">SWIPER</a> IS PERFECT FOR THIS IDEA BEACUSE OF ITS unique <code>preventClicks</code>  Parameter (Prevent accidental unwanted clicks on links during swiping) - <strong>Works like magic</strong>. Also its really <b>hard</b> to find - Code example of working photoswipe combination with any slider out there(slick, flickity, owl etc.) and in general slider & lightbox - so i hope this example be usefull for you.</p> 

<!-- Slider main container -->
<div class="swiper-container">