プリロードjavascript

私は、時間と日付などを読み込むためのスクリプトを持っています。私は結果をdivにロードし、そのdivにはCSS3アニメーションを入力します。唯一の問題は、時間と日付が実際にロードされるのに数秒かかることです。突然表示されます。ページをロードするとすぐには表示されないので、スクリプトが読み込まれるまでにアニメーションが終了しているため、アニメーションも表示されません。プリロードjavascript

私の質問です：時間と日付のスクリプトが読み込まれるまで、ページの読み込みを遅らせることは可能ですか？

免責事項：これは私が作業している純粋に実験的/創造的なプロジェクトであり、私は効率について心配していません。

スクリプト：

<script> 
    var dayarray=new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday") 

    var montharray=new Array("January","February","March","April","May","June","July","August","September","October","November","December") 

    function getthedate(){ 
    var mydate=new Date() 
    var year=mydate.getYear() 
    if (year < 1000) 
    year+=1900 
    var day=mydate.getDay() 
    var month=mydate.getMonth() 
    var daym=mydate.getDate() 
    if (daym<10) 
    daym="0"+daym 
    var hours=mydate.getHours() 
    var minutes=mydate.getMinutes() 
    var seconds=mydate.getSeconds() 
    var dn="AM" 
    if (hours>=12) 
    dn="PM" 
    if (hours>12){ 
    hours=hours-12 
    } 
    if (hours==0) 
    hours=12 
    if (minutes<=9) 
    minutes="0"+minutes 
    if (seconds<=9) 
    seconds="0"+seconds 
    //change font size here 
    var cdate="<div class='ref'><span>"+hours+":"+minutes+"</span> "+dn+"</div>"+dayarray[day]+", "+montharray[month]+" "+daym+", "+year+"" 
    if (document.all) 
    document.all.clock.innerHTML=cdate 
    else if (document.getElementById) 
    document.getElementById("time-date").innerHTML=cdate 
    else 
    document.write(cdate) 
    } 
    if (!document.all&&!document.getElementById) 
    getthedate() 
    function goforit(){ 
    if (document.all||document.getElementById) 
    setInterval("getthedate()",1000) 
    } 
</script>

HTML：

<body onLoad="goforit()"> 
    <div id="time-date"></div> 
</body>

出典

2011-06-29 Grefcs

あなたのコードは、明示的にデータをロードする前に1秒を待ちます。あなたはsetInterval()文の前にgetthedate()への即時電話をかける必要があります。これは、ページの読み込みをブロックする必要性を回避することができる

if (document.all||document.getElementById) 
    getthedate() 
    setInterval("getthedate()",1000) 
    }

。これで十分でない場合は、ページ全体がロードされた後にのみ実行されるonload経由でコードを呼び出すのではなく、コードをインラインに配置することをお勧めします。

出典

2011-06-29 18:35:27

ニースキャッチ。私はそれを見ませんでした。 –

私はどちらもしませんでした。ありがとう、素晴らしい作品！ – Grefcs

あなたはbody onloadイベントからスクリプトを呼び出しています。したがって、定義によって、ページが完全に読み込まれるまで待機します。

スクリプトを先に実行したい場合は、希望する構文解析の位置にgoforit()関数を呼び出すHTMLの中にスクリプトタグを置くことができますが、結果はそれほど良くない可能性があります。

<div id="time-date"></div> 
<script type='text/javascript'> 
    goforit(); 
</script>

出典

2011-06-29 18:35:49

このスクリプトをdivの下に配置します。あなたのdivは、スクリプトを実行する前にロードする必要があります。

出典

2011-06-29 18:35:52

答えて

関連する問題