javascript - setTimeout not working, other methods of queuing in a for loop? -
code below (the divs shaded in real example, want sequentially decrease opacity 0 each disappears, in order.
i tried doing without using settimeout, of divs disappeared simultaneously - know part of code changes opacity works, cant seem them work sequentially.
when try use settimeout (which presume implementing incorrectly),nothing happens!
any appreciated this, i'm new javascript , haven't touched in while , tutorials haven't been able me.
<body> <div id="div1"></div> <div id="div2"></div> <div id="div3"></div> <div id="div4"></div> <script type="text/javascript"> // divs want cycle through named here. var divs = ["#div1", "#div2", "#div3", "#div4"]; var divslength = divs.length; (var = 0; < divslength; i++) { settimeout(function(){ $(divs[i]).fadeto(1000, 0, function() { }); },1500); }; </script> </body>
here's way should able without settimeout
:
function dofade(items, index) { $(items[index]).fadeto(1000, 0, function() { dofade(items, index + 1); }); } dofade(divs, 0);
if you're targetting browsers support es5 (most modern versions do), can further simplify dofade:
function dofade(items, index) { $(items[index]).fadeto(1000, 0, dofade.bind(this, items, index + 1)); }
Comments
Post a Comment