2013-03-28 8 views
17

Napisałem skrypt jquery, który pozwala mi zanikać divy i out, a następnie powtórzyć. Kod działa poprawnie. Jednak, gdy próbuję dodać opóźnienie (chcę, aby div pozostał na kilka sekund przed zniknięciem), to nie działa poprawnie. Próbowałem dodać opóźnienie w kilku miejscach wewnątrz kodu i żaden nie wydaje się działać poprawnie. Używam jQuery w wersji 1.9.1Opóźnienie JQuery przed fadeOut

Oto skrypt, który napisałem:

$(document).ready(function(){ 
    ShowPostDiv(0); 
}); 

function ShowPostDiv(divIndex) 
{ 
    $(".home_entry_txt").hide(); 

    if(divIndex >= $(".rotate_hide").length) 
    { 
     divIndex = 0; 
    } 
    var divPostHtml = $(".rotate_hide:eq("+divIndex+")").html(); 
    $(".home_entry_txt").html(divPostHtml); 
    $(".home_entry_txt").fadeIn(3000, function(){ 
      $(".home_entry_txt").fadeOut("slow"); 
     }); 
    divIndex++; 
    setTimeout("ShowPostDiv("+divIndex+")", 4000); 
} 
+0

Czy próbowałeś $ ("home_entry_txt. "), Opóźnienie (5000) .fadeOut (" slow"). ? – isotrope

+0

Jako notatkę boczną należy użyć anonimowej funkcji setTimeout, a nie napisu. Tak więc, 'setTimeout (function() {ShowPostDiv (divIndex);}, 4000);' –

Odpowiedz

1

Myślę, że problemem jest to, że trzeba przekazać funkcję jako pierwszy parametr, a ty przechodzą ciąg znaków. Spróbuj wymienić linii setTimeout() z tym:

setTimeout(function(){ 
    ShowPostDiv(divIndex); 
}, 4000); 

Źródło:http://www.w3schools.com/jsref/met_win_settimeout.asp

+3

nie osiągnie celu PO. To tylko opóźni, gdy początkowe zaniknięcie nastąpi, ponieważ opóźnisz całe wywołanie funkcji – iAmClownShoe

+2

To nie jest wcale rozwiązanie. Jest to dokładnie to samo, ale z lepszą praktyką. Nie używaj też w3schools: http://w3fools.com/ –

32

można po prostu napisać

$(".home_entry_txt").fadeIn(3000).delay(1000).fadeOut("slow"); 
2

spróbować

$(document).ready(function(){ 
    ShowPostDiv(0); 
}); 

function ShowPostDiv(divIndex) 
{ 
    $(".home_entry_txt").hide(); 

    if(divIndex >= $(".rotate_hide").length) 
    { 
     divIndex = 0; 
    } 
    var divPostHtml = $(".rotate_hide:eq("+divIndex+")").html(); 
    $(".home_entry_txt").html(divPostHtml); 
    $(".home_entry_txt").fadeIn(3000, function(){ 
     setTimeout(function(){ 
      $(".home_entry_txt").fadeOut("slow"); 
     },4000); 
    }); 
    divIndex++; 
} 
+0

Dzięki! Spróbowanie tego spowodowało, że zniknęło, zatrzymaj się chwilę, a następnie zaniknij. To jest to czego chcę. Jednak nie powtórzy się z następnym div. Jak mógłbym to powtórzyć, żeby następny div zniknął, zostać chwilę, a potem zejść? – user2220474

+0

nie jestem pewien, co masz na myśli przez następny div? – iAmClownShoe

2

Czy próbowałeś .delay ()? coś takiego:

$(".home_entry_txt").fadeIn().delay(200).queue(function(next) { 
$(".home_entry_txt").fadeOut("slow"); 
});