ホームページ > ウェブフロントエンド > htmlチュートリアル > Web ページ上の画像を表示する前に 5 秒待機させる方法_html/css_WEB-ITnose

Web ページ上の画像を表示する前に 5 秒待機させる方法_html/css_WEB-ITnose

WBOY
リリース: 2016-06-24 12:22:40
オリジナル
2304 人が閲覧しました

Web ページ上の画像を表示する前に 5 秒間待機させる方法。

Webページを開くと、Webページ内の写真がすぐに表示されます。 Webページを開いてから5秒後に特定の画像を表示させる方法。


ディスカッションへの返信(解決策)

1. 画像読み込みの判定イベントがあり、そのイベント内で画像オブジェクトの表示・非表示を設定します
2. Webページにタイマーを追加し、いつ5秒になると指定した画像が表示されます

<style>#div1{height:100px;width:100px;background-color:yellow;display:none}</style><script type="text/javascript">	window.onload=function(){		var i=1;		setInterval(function(){			i++			if(i==5){				document.getElementById("div1").style.display="block";			}		},1000);	}</script><div id="div1">11222</div>
ログイン後にコピー

JSタイマーsetInterval

jsで制御するにはsetTimeout()

タイマーsetIntervalを使用します

setTimeout()は一定時間後に実行されるように定義された関数ですイベントトリガー後の一定時間実行
実行時間は自分で定義
setInterval() Yes イベントトリガー後、一定時間ごとに実行

作成者が自分で選択可能


2 階のコードには多くのエラーがあります。
1. 要件に従って、setInterval() の代わりに setTimeout() を最初に使用する必要があります。これは、関数の説明を 7 階に転記したものです。
2. また、5 秒後に表示する場合は、1 秒のイベントを設定してカウントする必要はなく、余分です。
3. setInterval()を使用する場合、表示操作をトリガーした後、clearInterval()を使用して不要なタイミングの継続をキャンセルする必要があります。

正しい方法は setTimeout() を直接使用することです。これは 5 秒で完了します:

人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート