Fancybox slideshow

fancybox slideshow with thumbs next pre Effect
DEMO
HTML

<a class="slideshow" rel="slideshow" href="http://lorempixel.com/output/sports-q-c-400-200-1.jpg" title="Cricket">
  <img src="http://lorempixel.com/400/200/sports/1" width="200px" height="100px"  alt="" />
</a>

<a class="slideshow" rel="slideshow" href="http://lorempixel.com/output/sports-q-c-400-200-2.jpg" title="Water skiing">
  <img src="http://lorempixel.com/400/200/sports/2" width="200px" height="100px"  alt="" />
</a>

<a class="slideshow" rel="slideshow" href="http://lorempixel.com/output/sports-q-c-400-200-3.jpg" title="Cycle Racing">
  <img src="http://lorempixel.com/400/200/sports/3" width="200px" height="100px" alt="" />
</a>

<a class="slideshow" rel="slideshow" href="http://lorempixel.com/output/sports-q-c-400-200-4.jpg" title="Isabela">
  <img src="http://lorempixel.com/400/200/sports/4" width="200px" height="100px" alt="" />
</a>

$('.slideshow').fancybox({
    prevEffect: 'elastic',
    nextEffect: 'elastic',
    helpers: {
        thumbs: {
            width: 100,
            height: 50
        }
    }
});