私は主にjqueryまたはjavascriptプログラマーではありません。これを達成するためのより効率的な方法があるかもしれませんが、最終的には、Firefoxで8秒後に失敗するスクリプトをデバッグした後です。
いずれかのコマンド プロンプトの近くにカーソルを合わせると、jquery アニメーション スプライトを開始する jquery スクリプト .hover イベントが発生します。
FireFox を除くすべてのブラウザで問題なく動作します。失敗し始める前に、8 秒間まとめて再生されます。これは、4 つのゾーン/スクリプトのそれぞれの累積です。
このスクリプトを修正してデバッグする方法はありますか?
(以下のスクリプトは 4 つの象限のうちの 1 つを抜粋したものです。使用されているすべてのスクリプトは、現時点ではインデックスにインラインで表示されています。簡単にデバッグできるように、URL にアクセスして全体を確認してください)
<script type='text/javascript'>
/* timer functions */
var intvalBR="";
function setIntBR(){if(intvalBR===""){
intvalBR=window.setInterval("BR()",100);
}else{
stop_IntBR();
}
}
/* timer reset functions */
function stop_IntBR(){
if(intvalBR!==""){
window.clearInterval(intvalBR);
intvalBR="";
}
}
/* background reset functions */
function resetBotRight(){
$("#bottom-right").css({'background-position': '0px 0px'});
}
// first frame of animation
var frame = 1;
function BR()
{
var left = 400 * frame;
// top stays 0 since all the images are have Y positioned at 0
var top = 0;
$('#bottom-right').css('backgroundPosition','-'+left+'px -'+top+'px');
frame++;
}
$("#bottom-right-inside").hover(function(){
$("#bottom-right-inside").addClass("bottom-right-inside");
setIntBR();
},
function(){
$("#bottom-right-inside").removeClass("bottom-right-inside");
stop_IntBR();
resetBotRight();
});
});
</script>