jquery - Improve JavaScript setInterval code -
jquery - Improve JavaScript setInterval code -
i have bit of javascript uses jquery animate create water motion effect.
var waves = function() { (function() { var firstwave = function() { this.css = function(p) { var s = math.sin(p*5) var x = (960 * 2) - (p * 960) + 10 var y = s * 5 + 15 homecoming {backgroundposition: "-" + x + "px", bottom: "-" + y + "px"} } }; var tidalwave = function() { $("#waves-1").animate({path: new firstwave}, 10999, "linear"); }; setinterval(tidalwave, 500); })(); };
waves()
called within $(document).ready()
handler.
as can see, setinterval
set 500 though animation lasts under 11 seconds. did ensure animation starts on page load, since calling $.animate()
did not kick off animation.
i'm sure doing way have lot of speed issues , whatever else.
can improved?
you should utilize settimeout instead of setinterval (there various advantages, see here: settimeout or setinterval?) , because want repeat should settimeout within tidalwave function invokes tidalwave again.
var tidalwave = function() { $("#waves-1").animate({path: new firstwave}, 10999, "linear"); settimeout(tidalwave, 500); }; settimeout(tidalwave, 500);
now utilize $(document).ready instead of initial timeout.
javascript jquery jquery-animate setinterval
Comments
Post a Comment