私のホームページのあるdivにテキストがありますが、明るい背景（不透明度が低い）で表示され、divの幅が50％になり、2秒後に読み込まれます。ページの読み込み。私はjavascriptで試しましたが、動作しません。私のCSSファイルの は "transition：width 2s;"ホームページのonloadイベント
var slider = document.getElementById("splasher");
function splasher(){
slider.style.width="50%";
}
は私が
onload ="splasher();"
まだレンダリングされていない可能性があります。この
次のようなものが必要です。最初はDOMがロードされるのを待ちます。それから、私たちはスプラッシャーのタイムアウトを設定しました。
document.addEventListener("DOMContentLoaded", function(){
var slider = document.getElementById("splasher");
function splasher(){
slider.style.width="50%";
slider.style.opacity = 0.5;
slider.style.display = 'block';
}
setTimeout(splasher, 2000);
})<h4>Slider Demo</h4>
<div id="splasher" style="display:none;">Slider</div>Chrisさんに感謝しますが、この（スライダ）テキストは2秒後に表示され、背景はあまり表示されないようにしてください – shumonira
答えは@Christosです。あなたの説明に基づいて、ページがレンダリングされた後で、ロードされてからではなく、遅れが必要です。したがって、 '' DOMContentLoaded''を '' load "'に変更してください。あなたが記述しているものはすべて、CSSで実現できます。 – alttag
あなたは大歓迎です！あなたのHTMLコードを知っていないので、あなたを導くのは少し難しいです。しかし、私の更新を確認してくださいあなたが探しているものに近いと思う。 – Christos
あなたのスライダの任意のヘルプであるdiv要素にonloadイベントを置きます。中に入れてonload同様に。
<body onload="loaded()">
function loaded() {
var slider = document.getElementById("splasher");
function splasher(){
slider.style.width="50%";
}
}
あなたは要素がロードされる前にvar slider=...行を実行しないことを確認する必要があります。
要素がロードされる前に 'var slider = ...'行を実行しないようにする必要があります。 –
'onload'は' body'に行く必要があります。おそらく 'div'ではありません。 – putvande
Scottさん、要素がロードされた後に実行されます – shumonira