Jquery Gallerific and fancybox conflict
So i looked around here and couldn't find anything that works. I am trying to load a gallery with gallerific and inside there is an image that i want to open using fancybox. It seems like gallerific takes over and you can't do anything with the elements inside. Even if i try to call so开发者_运维问答mething within the gallery it just returns null.
I even tried to call fancybox on the onPageTransitionIn and onTransitionIn. The onTransitionIn breaks the gallery and it does nothing on the onPageTrans.
Any ideas?
I set this so that the default galleriffic download image inside the caption instead loads fancybox window
$(document).ready(function() {
var gallery = $('#thumbs').galleriffic({
delay: 2500,
numThumbs: 15,
preloadAhead: 10,
enableTopPager: false,
enableBottomPager: false,
maxPagesToShow: 7,
imageContainerSel: '#slideshow',
controlsContainerSel: '#controls',
captionContainerSel: '#caption',
loadingContainerSel: '#loading',
renderSSControls: true,
renderNavControls: true,
enableHistory: false,
autoStart: false,
syncTransitions: true,
defaultTransitionDuration: 900,
onTransitionIn: function(slide, caption, isSync) {
slide.fadeTo(this.getDefaultTransitionDuration(isSync), 1.0);
if (caption){
caption.fadeTo(this.getDefaultTransitionDuration(isSync), 1.0);
caption.find("a.fancybox").fancybox({
'titleShow' : true,
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'easingIn' : 'easeOutBack',
'easingOut' : 'easeInBack'
});
}
}
});
});
Ok so i finally got this. In case anyone else has difficulties.
You can define what you want in the onTransition.
Then you can call the regular function to get
onTransitionIn: function(slide, caption, isSync) {
slide.fadeTo(this.getDefaultTransitionDuration(isSync), 1.0);
if (caption)
caption.fadeTo(this.getDefaultTransitionDuration(isSync), 1.0);
manipulate elements here
}
It will load it the default way and you can then do what you want.
精彩评论