performance - JQuery animate slower every call -
i have modal box open jquery. when close buttons called, modal box closed. works fine, more open , close modal box, longer takes modal box close:
window.closemodal = function () { modal = $("div.modal-overlay"); windowheight = $(window).height(); // until here performance modal.animate({top: windowheight, }, 800, function () { // problem modal.hide(); $("body").css("overflow-y", "scroll"); }); }
i have put console logs on every line, , executed instantly until hit modal.animate function. every time open modal, , press close button, takes more time until modal.animate starts executing.
can shed light please.
@edit: have created jsfiddle shows problem.
just press open modal, close modal. 4-5 times see delay become bigger
@@edit: strange happens.
although openmodal executed once, iframe.load executed # times modal opened , closed ...
window.openmodal = function (url) { console.log("open start"); modal = $("div.modal-overlay"); modaliframe = $("div.modal-overlay iframe"); windowheight = $(window).height(); modal.css("bottom", "0"); modaliframe.attr("src", url + "?frame=true"); modaliframe.load(function () { console.log("open load") modaliframe.css('height', windowheight); modal.show().animate({ top: 0, }, 800, function () { $("body").css("overflow-y", "hidden"); }); }); }
i think solved problem,
it seems changing iframe url, "load handler gets attached again". every time "load executed', attached. solved using code:
modaliframe.one('load',function () {}); //instad of modaliframe.load(function () {});
is practice ?
Comments
Post a Comment