2013-01-31 18 views
9

現在、ページがロードされてから2秒後にdivを表示しようとしています。ページが読み込まれてから2秒後にdivを隠すことで、その逆をうまくやり遂げることができます。問題は何も起こらず、divは隠れているということです。ページの読み込みが2秒後にdivを正しく表示するにはどうすればよいですか?エクストラ:その後、2秒ショーにAJAXローディングGIFを実行している間、平均値とのdivをフェードインページロードの2秒後にdivを表示

<script type = "text/javascript"> 
$(window).load(function() { 
    setTimeout(function() { 
     $("#contentPost").show('fadeIn', {}, 500) 
    }, 2000); 
}); 
</script> 

HTML/CSS

<style> 
.contentPost { display:none;} 
</style> 

<div class="contentPost"> 
<h2>Hi there</h2> 
</div> 
+0

HTMLを表示する - どのように非表示にしていますか? –

+0

@ SteveH。私はまだ何も表示されていないhtmlの – CodingWonders90

答えて

25
$(document).ready(function() { 
    $(".contentPost").delay(2000).fadeIn(500); 
}); 

完全に機能します。

+1

これは素晴らしいjQueryの優雅さです。 – jmbertucci

+0

@Moosemanまだ何も表示されていません。 HTMLで質問を更新しました。私は実際にCSSでdivを隠しています。 'display:none;' – CodingWonders90

+2

'.fadeIn(500);'は 'display:none'をオーバーライドします。私はあなたのHTMLがIDではなくクラス名を使用していることに気付きました。私はそれを反映するために私の答えを更新しました。 – Mooseman

4

アイブ氏はそのように書かれてあなたのショー方法を見たことがありません。使用にjqueryのメソッドfadeInそれを変更してみてください。

<script> 
$(function() { 
    $("#contentPost").delay(2000).fadeIn(500); 
}); 
</script> 

show方法は、任意の引数を受け入れないと、あなたはそれがしたいように動作しません。

+0

を追加しました。 HTMLで質問を更新しました。私は実際にCSSの 'display:none;'でdivを隠しています。 – CodingWonders90

+0

@Undefined show()*は、jQuery 1.0のドキュメントページ(https://api.jquery.com/show/)に従ってオプションを取ることができます。 –

関連する問題