Reputation: 2577
Anybody knows how to speed up the fade in and fade out animation of nyroModal?
Right now I am intializing it like this :
<a href="demoSent.php" class="nyroModal" rev="modal">Ajax without closing</a>
<script type="text/javascript">
$(function() {
$('.nyroModal').nyroModal();
});
</script>
And that's all.
However, the animation after clicking my links for the modal box is a little bit slow for my liking.
How can I make it faster? The documentation for nyroModal is quite difficult to understand, at least for me, so, any advice will be helpful.
UPDATE:
In the jquery file jquery.nyroModal.custom.js
is this code for the animation, at least I guess:
/*
* nyroModal v2.0.0
*
* Fade animations
*
* Depends:
*
*/
jQuery(function($, undefined) {
$.nmAnims({
fade: {
showBg: function(nm, clb) {
nm.elts.bg.fadeTo(250, 0.7, clb);
},
hideBg: function(nm, clb) {
nm.elts.bg.z(clb);
},
showLoad: function(nm, clb) {
nm.elts.load.fadeIn(clb);
},
hideLoad: function(nm, clb) {
nm.elts.load.fadeOut(clb);
},
showCont: function(nm, clb) {
nm.elts.cont.fadeIn(clb);
},
hideCont: function(nm, clb) {
nm.elts.cont.css('overflow', 'hidden').fadeOut(clb);
},
showTrans: function(nm, clb) {
nm.elts.load
.css({
position: nm.elts.cont.css('position'),
top: nm.elts.cont.css('top'),
left: nm.elts.cont.css('left'),
width: nm.elts.cont.css('width'),
height: nm.elts.cont.css('height'),
marginTop: nm.elts.cont.css('marginTop'),
marginLeft: nm.elts.cont.css('marginLeft')
})
.fadeIn(function() {
nm.elts.cont.hide();
clb();
});
},
hideTrans: function(nm, clb) {
nm.elts.cont.css('visibility', 'hidden').show();
nm.elts.load
.css('position', nm.elts.cont.css('position'))
.animate({
top: nm.elts.cont.css('top'),
left: nm.elts.cont.css('left'),
width: nm.elts.cont.css('width'),
height: nm.elts.cont.css('height'),
marginTop: nm.elts.cont.css('marginTop'),
marginLeft: nm.elts.cont.css('marginLeft')
}, function() {
nm.elts.cont.css('visibility', '');
nm.elts.load.fadeOut(clb);
});
},
resize: function(nm, clb) {
nm.elts.cont.animate({
width: nm.sizes.w,
height: nm.sizes.h,
top: (nm.getInternal().fullSize.viewH - nm.sizes.h - nm.sizes.hMargin)/2,
left: (nm.getInternal().fullSize.viewW - nm.sizes.w - nm.sizes.wMargin)/2
}, clb);
}
}
});
// Define fade aniamtions as default
$.nmObj({anim: {def: 'fade'}});
});
But I am clueless how to alter this code so the animation is faster.
Any idea?
Upvotes: 1
Views: 123
Reputation: 26
showBg: function(nm, clb) {
nm.elts.bg.fadeTo(200, 0.7, clb);
},
hideBg: function(nm, clb) {
nm.elts.bg.fadeOut(200, clb);
},
showLoad: function(nm, clb) {
nm.elts.load.fadeIn(200, clb);
},
hideLoad: function(nm, clb) {
nm.elts.load.fadeOut(200, clb);
},
showCont: function(nm, clb) {
nm.elts.cont.fadeIn(200, clb);
},
hideCont: function(nm, clb) {
nm.elts.cont.css('overflow', 'hidden').fadeOut(200, clb);
},
Upvotes: 0