web-dev-qa-db-ja.com

jQueryは5秒間表示してから非表示にします

フォームの送信が成功した後、.showを使用して非表示のメッセージを表示しています。

メッセージを5秒間表示してから非表示にする方法

135
josoroma

次のように、アニメーションの前に .delay() を使用できます。

$("#myElem").show().delay(5000).fadeOut();

アニメーションでない場合は、次のように setTimeout() を直接使用します。

$("#myElem").show();
setTimeout(function() { $("#myElem").hide(); }, 5000);

2つ目は、.hide()が通常は持続時間なしではアニメーション(fx)キューにないため、これは単なる効果です。

または、次のように .delay() および .queue() を自分で使用することもできます。

$("#myElem").show().delay(5000).queue(function(n) {
  $(this).hide(); n();
});
324
Nick Craver

以下の効果を使用してアニメーション化できます。要件に応じて値を変更できます

$("#myElem").fadeIn('slow').animate({opacity: 1.0}, 1500).effect("pulsate", { times: 2 }, 800).fadeOut('slow'); 
16
Rahul