Animation in Folge in JQuery

-1

Ich schrieb diesen Code einige Animationen zu machen, und es funktioniert perfekt:Animation in Folge in JQuery

for (var i = 0; i < $("div[id$='-1']").length; i++) { 
      $("div[data-order="+ i +"]").css({opacity: 0, visibility: "visible"}).animate({ 
       top : '0%', 
       opacity: 1 
      }, { 
       duration : 800, 
       easing : 'linear' 
      }); 
    };

, aber wenn ich es, um mit einer gewissen Verzögerung mit setTimeout angezeigt werden wollte arbeiten, um es keine internationalen Mehr!

for (var i = 0; i < $("div[id$='-1']").length; i++) { 
     setTimeout(function() { 
      $("div[data-order="+ i +"]").css({opacity: 0, visibility: "visible"}).animate({ 
       top : '0%', 
       opacity: 1 
      }, { 
       duration : 800, 
       easing : 'linear' 
      }); 
     }, 1000); 
    };

Quelle

2016-06-27 G.Mab

versuchen Sie, Ihre Schleife innerhalb der eingestellten Zeit zusammen mit Ihrem Code für die Animation zu setzen. –

'setTimeout' stoppt die Schleife nicht. Im Grunde wird jede Iteration das gleiche 'setTimeout' haben und auf einmal abgehen. –

@ JF-Mechs auf diese Weise immer noch die Animation in der gleichen Zeit angezeigt, wollte ich etwas Verzögerung, so dass die Reihenfolge bemerkenswert sein könnte. –

können Sie dies versuchen .. Und Stattdessen for-Schleife können Sie .each()

$("div[id$='-1']").each(function(index){ 
    setTimeout(function() { 
      $("div[data-order="+ index +"]").css({opacity: 0, visibility: "visible"}).animate({ 
       top : '0%', 
       opacity: 1 
      }, { 
       duration : 800, 
       easing : 'linear' 
      }); 
     }, 1000 * index); 
});

Quelle

2016-06-27 01:03:56

yesssss !! Vielen Dank Brother^__^ –

@ G.Mab Du bist total Willkommen :) .. Viel Glück –

Verwenden Mathematik verwenden:

setTimeout(function() { 
    // ... 
}, 1000 * i);

Quelle

2016-06-27 01:05:19

genau :)) das war mein Fehler! –

Sie können .queue() verwenden, .delay(), .promise()

var order = $("div[data-order]"); 
order.queue("order", $.map(order, function(el) { 
    return function(next) { 
    return $(el).delay(1000).css({opacity: 0, visibility: "visible"}) 
      .animate({ 
       top : '0%', 
       opacity: 1 
      }, { 
       duration : 800, 
       easing : 'linear' 
      }).promise().then(next); 

    } 
})).dequeue("order")

Quelle

2016-06-27 01:07:29 guest271314

vielen dank^__ ^ –

Animation in Folge in JQuery

Antwort

Verwandte Themen