Прихойте дів через кілька секунд

Мені було цікаво, як в jquery я можу приховати діву через кілька секунд? Наприклад, повідомлення Gmail.

Я намагався з усіх сил, але не можу працювати.

Це приховає діву через 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>

Якщо ви хочете просто сховатися, не затухаючи, використовуйте hide().

Ви можете спробувати .delay()

$(".formSentMsg").delay(3200).fadeOut(300);

виклику div встановіть час затримки в мілісекундах і встановіть властивість, яку ви хочете змінити, в цьому випадку я використовував .fadeOut (), щоб він міг бути анімований, але ви можете також використовувати .hide ().

http://api.jquery.com/delay/

jquery пропонує різноманітні методи приховати дів тимчасово, які не потребують налаштування та пізніше очищення або скидання таймерів інтервалу або інших обробників подій. Ось кілька прикладів.

Чиста прихованість, затримка на одну секунду

// 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/

Існує дійсно простий спосіб зробити це.

Проблема полягає в тому, що .delay впливає лише на анімації, тому те, що вам потрібно зробити, це змусити змусити .hide () діяти як анімація, надаючи їй тривалість.

$("#whatever").delay().hide(1);

Надаючи йому приємну коротку тривалість, вона здається миттєвою, як і звичайна функція .Hide.

$.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 (та її родичі, Function, setTimeout і setInterval) забезпечують доступ до компілятора JavaScript. Це іноді необхідно, але в більшості випадків це свідчить про наявність вкрай поганого кодування. Функція eval є найбільш зловживаною функцією JavaScript.

http://www.jslint.com/lint.html

Напевно, найпростіший спосіб - використовувати плагін таймерів. http://plugins.jquery.com/project/timers, а потім викликайте щось подібне

$(this).oneTime(1000, function() {
    $("#something").hide();
  });

ми можемо безпосередньо використовувати

$('#selector').delay(5000).fadeOut('slow');

<script>
      $(function() {
      $(".hide-it").hide(7000);
    });              
</script>

<div id="hide-it">myDiv</div>