답변:
업데이트 : jQuery 1.4부터이 .delay( n )
방법을 사용할 수 있습니다 . http://api.jquery.com/delay/
$('.notice').fadeIn().delay(2000).fadeOut('slow');
참고 : $.show()
그리고 $.hide()
기본적으로 사용하려는 경우 그래서, 대기하지 않는 $.delay()
그들과 함께, 당신은 그들에게 그런 식으로 구성해야합니다 :
$('.notice')
.show({duration: 0, queue: true})
.delay(2000)
.hide({duration: 0, queue: true});
Queue 구문을 사용할 수 있으며 다음과 같이 작동 할 수 있습니다.
jQuery(function($){
var e = $('.notice');
e.fadeIn();
e.queue(function(){
setTimeout(function(){
e.dequeue();
}, 2000 );
});
e.fadeOut('fast');
});
또는 정말 독창적이고 jQuery 함수를 만들 수 있습니다.
(function($){
jQuery.fn.idle = function(time)
{
var o = $(this);
o.queue(function()
{
setTimeout(function()
{
o.dequeue();
}, time);
});
};
})(jQuery);
이론적으로는 여기에서 메모리 작업을 수행하여 다음과 같이 할 수 있습니다.
$('.notice').fadeIn().idle(2000).fadeOut('slow');
Ben Alman은 doTimeout이라는 jQuery 용 달콤한 플러그인을 작성했습니다. 멋진 기능이 많이 있습니다!
여기에서 확인하십시오 : jQuery doTimeout : setTimeout과 비슷하지만 더 좋습니다 .
그렇게 사용하려면을 반환해야합니다 this
. 반환이 없으면 fadeOut ( 'slow')은 해당 작업을 수행 할 객체를 얻지 못합니다.
즉 :
$.fn.idle = function(time)
{
var o = $(this);
o.queue(function()
{
setTimeout(function()
{
o.dequeue();
}, time);
});
return this; //****
}
그런 다음 이렇게하십시오.
$('.notice').fadeIn().idle(2000).fadeOut('slow');
이것은 몇 줄의 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);
});
작동 예는 아래 바이올린을 참조하십시오 ...