2

私が取り組んでいるこのスクリプトの助けを探しています。これが私のファイルfade.jsです。問題は変更にあり、めちゃくちゃです。この問題と解決策を見つけるのを手伝ってください、ありがとう。

JS ファイル

//image fade script
var opacity = 0;
function changeimg(currentimage){

rnumb = Math.floor(Math.random()*2);
var newimage = "./images/" + rnumb + ".jpg";
if (newimage !== currentimage)
{
document.getElementById("fadeImg").src= newimage;
}


}
function fadein()
{
       var fadeImg = document.getElementById('fadeImg');

       var browserName=navigator.appName;

       if(browserName=="Microsoft Internet Explorer")
       {

              browserOpacity = opacity / 10;

              fadeImg.filters.alpha.opacity = browserOpacity;

       }
       else
       {

              browserOpacity = opacity / 1000;

              fadeImg.style.opacity = browserOpacity;

       }

       if(opacity < 1000)
       {

              initiate();

       }
else if(opacity == 1000)
{
changeimg(document.getElementById("fadeImg").src);
opacity = 0;
}

}


function initiate()
{

       opacity++;
       setInterval("fadein()", 500);

}

index.html

<script type="text/javascript" src="fade.js"></script>
<body onload="initiate()">
<img id="fadeImg" src="images/1.jpg" style="opacity:0.0; filter:alpha(opacity=0)"/>
</body>

JSフィドル

コードのフィドルもここにあります: http://jsfiddle.net/epqKr/2/ (コードは、フィドルにあるため、しばらくするとブラウザがフリーズする可能性があることに注意してください。

4

3 に答える 3

1

cross-browser libraryこのようなことを達成 するには、 a を使用する必要があると思います。Microsoft Internet Explorer、特にバージョン < 9 では、特に不透明度、アルファフィルター、およびタイミングを利用する関数を使用しようとすると、期待どおりに動作しない可能性が最も高くなります。jQuery, or Prototype, or MooToolsなどのフレームワークを使用してみてください。それらはすべて、探しているものをシンプル、安全、より良い方法で作成します.

于 2012-06-24T19:28:44.287 に答える
1

  • initiate()関数内から呼び出すのでfadeIn()はなく、不透明度制御変数 (つまりopacity += 1;) をインクリメントするだけです。

  • アニメーションが終了したら、setInterval の戻り値を保存して、コールバックを強制終了したいと思うでしょう。

  • また、間隔を短くしてアニメーションの速度を上げることもできます。

    animId = setInterval("fadeIn()", 5);

于 2012-06-24T19:32:03.117 に答える