homepage Welcome to WebmasterWorld Guest from 54.242.85.89
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Pubcon Website
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

    
Fancybox and nice transitions
toplisek




msg:4466682
 11:49 am on Jun 18, 2012 (gmt 0)

I have made some combination for transitions and background. Is this correct code? Some code is [jsfiddle.net...] and rest at Fancybox.

<script type="text/javascript">
jQuery(document).ready(function() {

(function ($, F) {
F.transitions.resizeIn = function() {
var endPos = $.extend({}, F.current.dim, F._getPosition(true));
var startPos;

startPos = F.tmpWrap.position();

startPos.width = F.tmpWrap.width();
startPos.height = F.tmpWrap.height();

F.inner
.css('overflow', 'hidden')
.width( F.tmpInner.width() )
.height( F.tmpInner.height() )
.css('opacity', 0);

F.wrap.css(startPos).show();

F.tmpWrap.trigger('onReset').remove();

F.wrap.animate(endPos, {
duration: F.current.nextSpeed,
step : F.transitions.step,
complete: function() {
setTimeout(function() {
F.inner.fadeTo("fast", 1, F._afterZoomIn);
}, 1);
}
});
};

F.transitions.resizeOut = function() {
if (F.tmpWrap) {
F.tmpWrap.stop(true).trigger('onReset').remove();
}

F.tmpWrap = F.wrap.stop(true, true);
F.tmpInner = F.inner.stop(true, true);
};

}(jQuery, jQuery.fancybox));


jQuery(".fancybox-effects-c").fancybox({
wrapCSS : 'fancybox-custom',
closeClick : true,

helpers : {
title : {
type : 'inside'
},
overlay : {
css : {
'background-color' : '#eee'
}
}
}
});

});





jQuery(".fancybox")
.attr('rel', 'gallery')
.fancybox({
nextMethod : 'resizeIn',
nextSpeed : 250,

prevMethod : 'resizeOut',
prevSpeed : 250
});


</script>
<style type="text/css">
.fancybox-custom .fancybox-skin {
box-shadow: 0 0 50px #222;
}
</style>

 

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About
© Webmaster World 1996-2014 all rights reserved