Мне было интересно, как в jquery я могу скрыть div через несколько секунд? Например, как сообщения Gmail.
Я старался изо всех сил, но не смог заставить его работать.
Мне было интересно, как в jquery я могу скрыть div через несколько секунд? Например, как сообщения Gmail.
Я старался изо всех сил, но не смог заставить его работать.
Это будет скрывать div через 1 секунду (1000 миллисекунд).
setTimeout(function() {
$('#mydiv').fadeOut('fast');
}, 1000); // <-- time in milliseconds
#mydiv{
width: 100px;
height: 100px;
background: #000;
color: #fff;
text-align: center;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="mydiv">myDiv</div>
Вы можете попробовать .delay()
$(".formSentMsg").delay(3200).fadeOut(300);
вызов div устанавливает время задержки в миллисекундах и устанавливает свойство, которое вы хотите изменить, в этом случае я использовал .fadeOut(), чтобы он мог быть анимированным, но вы также можете использовать .hide().
Там действительно простой способ сделать это.
Проблема заключается в том, что .delay влияет только на анимацию, поэтому то, что вам нужно сделать, это сделать .hide() действовать как анимация, дав ей длительность.
$("#whatever").delay().hide(1);
Придавая ему небольшую короткую продолжительность, он кажется мгновенным, как обычная функция .hide.
jquery предлагает множество способов скрыть div по времени, не требуя настройки и последующей очистки или сброса таймеров интервалов или других обработчиков событий. Вот несколько примеров.
Чистая шкура, задержка в одну секунду
// hide in one second
$('#mydiv').delay(1000).hide(0);
Чистая шкура, без задержки
// hide immediately
$('#mydiv').delay(0).hide(0);
Анимированная шкура
// start hide in one second, take 1/2 second for animated hide effect
$('#mydiv').delay(1000).hide(500);
исчезать
// start fade out in one second, take 300ms to fade
$('#mydiv').delay(1000).fadeOut(300);
Кроме того, методы могут принимать имя очереди или функцию в качестве второго параметра (в зависимости от метода). Документацию по всем вышеуказанным и другим связанным вызовам можно найти здесь: https://api.jquery.com/category/effects/
$.fn.delay = function(time, callback){
// Empty function:
jQuery.fx.step.delay = function(){};
// Return meaningless animation, (will be added to queue)
return this.animate({delay:1}, time, callback);
}
От http://james.padolsey.com/javascript/jquery-delay-plugin/
(Позволяет цепочку методов)
Использование таймера jQuery также позволит вам иметь имя, связанное с таймерами, прикрепленными к объекту. Таким образом, вы можете подключить несколько таймеров к объекту и остановить любой из них.
$("#myid").oneTime(1000, "mytimer1" function() {
$("#something").hide();
}).oneTime(2000, "mytimer2" function() {
$("#somethingelse").show();
});
$("#myid").stopTime("mytimer2");
Функция eval (и ее родственники, функция, setTimeout и setInterval) предоставляет доступ к компилятору JavaScript. Иногда это необходимо, но в большинстве случаев это указывает на наличие крайне плохого кодирования. Функция eval является самой неправильно используемой функцией JavaScript.
Вероятно, самый простой способ - использовать плагин таймеров. http://plugins.jquery.com/project/timers, а затем вызовите что-то вроде
$(this).oneTime(1000, function() {
$("#something").hide();
});
мы можем напрямую использовать
$('#selector').delay(5000).fadeOut('slow');