Saya mencoba membuat elemen memudar, lalu dalam 5000 ms memudar kembali. Saya tahu saya bisa melakukan sesuatu seperti:
setTimeout(function () { $(".notice").fadeOut(); }, 5000);
Tapi itu hanya akan mengontrol fade out, apakah saya akan menambahkan yang di atas pada panggilan balik?
Pembaruan: Mulai jQuery 1.4 Anda dapat menggunakan metode .delay( n ). http://api.jquery.com/delay/
$('.notice').fadeIn().delay(2000).fadeOut('slow');
Catatan: $.show() dan $.hide() secara default tidak dimasukkan dalam antrean, jadi jika Anda ingin menggunakan $.delay() dengan keduanya, Anda perlu mengonfigurasinya seperti itu:
$('.notice')
.show({duration: 0, queue: true})
.delay(2000)
.hide({duration: 0, queue: true});
Anda mungkin bisa menggunakan sintaks Antrian, ini mungkin berhasil:
jQuery(function($){
var e = $('.notice');
e.fadeIn();
e.queue(function(){
setTimeout(function(){
e.dequeue();
}, 2000 );
});
e.fadeOut('fast');
});
atau Anda bisa menjadi sangat cerdik dan membuat fungsi jQuery untuk melakukannya.
(function($){
jQuery.fn.idle = function(time)
{
var o = $(this);
o.queue(function()
{
setTimeout(function()
{
o.dequeue();
}, time);
});
};
})(jQuery);
yang (secara teori, mengerjakan memori di sini) memungkinkan Anda melakukan hal ini:
$('.notice').fadeIn().idle(2000).fadeOut('slow');
Saya baru saja mengetahuinya di bawah ini:
$(".notice")
.fadeIn( function()
{
setTimeout( function()
{
$(".notice").fadeOut("fast");
}, 2000);
});
Saya akan menyimpan postingan tersebut untuk pengguna lain!
Retasan hebat dari @strager. Implementasikan ke jQuery seperti ini:
jQuery.fn.wait = function (MiliSeconds) {
$(this).animate({ opacity: '+=0' }, MiliSeconds);
return this;
}
Dan kemudian gunakan sebagai:
$('.notice').fadeIn().wait(2000).fadeOut('slow');
Anda dapat melakukan sesuatu seperti ini:
$('.notice')
.fadeIn()
.animate({opacity: '+=0'}, 2000) // Does nothing for 2000ms
.fadeOut('fast');
Sayangnya, Anda tidak bisa melakukan .animate({}, 2000) begitu saja -- Saya pikir ini adalah bug, dan akan melaporkannya.
Ben Alman menulis plugin manis untuk jQuery bernama doTimeout. Ini memiliki banyak fitur bagus!
Lihat di sini: jQuery doTimeout: Seperti setTimeout, tapi lebih baik.
Untuk dapat menggunakannya seperti itu, Anda harus mengembalikan this. Tanpa pengembalian, fadeOut('slow'), tidak akan mendapatkan objek untuk melakukan operasi tersebut.
I.e.:
$.fn.idle = function(time)
{
var o = $(this);
o.queue(function()
{
setTimeout(function()
{
o.dequeue();
}, time);
});
return this; //****
}
Kemudian lakukan ini:
$('.notice').fadeIn().idle(2000).fadeOut('slow');
Ini dapat dilakukan hanya dengan beberapa baris jQuery:
$(function(){
// make sure img is hidden - fade in
$('img').hide().fadeIn(2000);
// after 5 second timeout - fade out
setTimeout(function(){$('img').fadeOut(2000);}, 5000);
});
lihat biola di bawah untuk contoh kerja...
