javascript change element size doesn't work properly -
i'm trying create javascript function (onmouseover) increase elements height , width 10px (1px increase 10 times settimeout), instead element increases 200px in height , 100px in width. doesn't make sense. example on how it's not working properly: www.modwebsolutions.com/test3/ source code:
var el; function changesize(id) { var elem=document.getelementbyid(id); el=elem; (var i=0; i<10; i++) { settimeout(changes,100); } } function changes() { var tempheight=el.offsetheight; var tempwidth=el.offsetwidth; el.style.height=tempheight + 1 +"px"; el.style.width=tempwidth + 1 + "px"; } // update: tried el.style.height=(parseint(tempheight) + 1) +"px"; el.style.width=(parseint(tempwidth) + 1) + "px";
this time adds 50px height , still 100px width... instead of 10px each way.
update: seems i'm gonna have answer own question, i'm still not sure, think has iterations running ahead of settimeout , messing up. unfortunately seems settimeout can work ok in recursive functions.
update2: recursive approach doesn't work well... total dead end.
may because tempwidth , tempheight trated string should try...
el.style.height= (parseint(tempheight) + 1) +"px"; el.style.width= (parseint(tempwidth) + 1) + "px";
Comments
Post a Comment