Fancybox gallery - manual call from link
fancybox testing
by ashleycam3ron
HTML
<script src="http://fancyapps.com/fancybox/source/jquery.fancybox.js"></script>
<link rel="stylesheet" href="http://fancyapps.com/fancybox/source/jquery.fancybox.css">
<div class="details_gallery">
<a href="#" class="manualfancybox">Manual Call Fancybox</a>
<div class="details_gallery_min"> <a rel="gallery" class="fancybox" href="http://fancyapps.com/fancybox/demo/1_b.jpg"><img src="http://fancyapps.com/fancybox/demo/1_s.jpg" alt=""/></a>
<a rel="gallery" class="fancybox" href="http://fancyapps.com/fancybox/demo/2_b.jpg"><img src="http://fancyapps.com/fancybox/demo/2_s.jpg" alt=""/></a>
<a rel="gallery" class="fancybox" href="http://fancyapps.com/fancybox/demo/3_b.jpg"><img src="http://fancyapps.com/fancybox/demo/3_s.jpg" alt=""/></a>
</div>
</div>
JavaScript
/*$(".fancybox").fancybox({
loop : false,
afterLoad: function(current, previous) {
console.info( 'Current: ' + current.href );
console.info( 'Previous: ' + (previous ? previous.href : '-') );
if (previous) {
console.info( 'Navigating: ' + (current.index > previous.index ? 'right' : 'left') );
}
}
}); */
$(".manualfancybox").click(function () {
var photos = new Array();
$(".details_gallery_min a").each(function () {
href = $(this).attr("href");
title = $(this).attr("title");
photos.push({
'href': href,
'title': title
})
});
jQuery.fancybox(photos, {
'transitionIn': 'elastic',
'easingIn': 'easeOutBack',
'transitionOut': 'elastic',
'easingOut': 'easeInBack',
'opacity': false,
'titleShow': true,
'titlePosition': 'over',
'type': 'image',
'titleFromAlt': true
});
});