jquery - divの時限表示

Question

必要なのは、 X秒後にdivsスタイルを変更するクライアント側コードjQueryまたはJSだけです。

visibility : hidden;または のように max-height : 50px;

またはDIVのクラス\IDを切り替えます（ 推奨 ）

Answer 1

setTimeoutを使用する

setTimeout(function(){
  // Change the style here... If using jQuery, it turns
  $('#my_divs').css({'visibility':'hidden', 'max-height':'50px'})
  // or
  $('#my_divs').addClass('my-custom-class');
}, x_seconds);

Answer 2

プレーンなJavaScriptソリューション：

setTimeout(function() {
  document.getElementById('your_div_id').className = 'new_class_name';
}, X * 1000); // X = number of seconds

Answer 3

$(document).ready(function(){
    setTimeout('changeStyle()', 1000); //milliseconds
});

function changeStyle() {
    //do something useful
}

Answer 4

これが私が現在のプロダクションウェブサイトで使用している方法の1つです。

$("#divStampWrapper").delay(1500).fadeIn("fast").delay(2500).animate({ top: -250 }, 2500).delay(2500).fadeOut("slow");

説明：基本的に、画像を保持しているdivを取得し、1.5秒待ってから、フェードインして表示を開始します。フェードイン効果が終了すると、さらに2.5秒間待機し、新しいトップ位置に上向きに移動し始めます。次に、さらに2.5秒間待機し、フェードアウトを開始します。あなたが求めていたよりも少し多いことは知っていますが、それはタイマーで何ができるかを示す良い例です。

Answer 5

数秒後に何度も時間を表示したい場合は、

setIntervel('changeStyle()',1000);

そして、あなたはただ一度だけ時間を使いたい、そしてそれから使う

setTimeout('changeStyle()',1000);
function changeStyle() {
 // code to display time
}