Mtok
Mtok

Reputation: 1630

Showing all divs one by one

I ve many divs in asp page and I want to show them after the page load one by one using jquery.show() or jquery.fadein() I mean they will not be shown all together, they should be shown one by one.

<div class = "trip">Trip1</div>
<div class = "trip">Trip2</div>
<div class = "trip">Trip3</div>
<div class = "trip">Trip4</div>

Thanks for any response.

Upvotes: 2

Views: 1966

Answers (4)

Sampson
Sampson

Reputation: 268344

$(".trip").each(function(i,o){
 $(o).delay(i*250).fadeIn();
});

Demo: http://jsbin.com/ibupud/2/edit

Upvotes: 1

Roko C. Buljan
Roko C. Buljan

Reputation: 206048

$(".trip").each(function(i,e) {
    $(this).delay(i*400).fadeIn();
});

Upvotes: 4

gdoron
gdoron

Reputation: 150253

$('.trip').each(function(index, element){
    $(this).delay(1000 * index).show(0);
});

Live DEMO

Upvotes: 3

noob
noob

Reputation: 9202

DEMO

$(".trip").each(function(i) {
    $(this).delay(i * 100).fadeIn();
});​

Upvotes: 3

Related Questions