1

iframe 内の絶対配置要素に小さな問題があります。

だから私はページを持っています。そのページには小さなゲームのiframeがあります。ゲームには男がいて、その男には絶対位置の生徒がいます。生徒はjavascriptで動いています。すべて問題なく動作しますが、そのページを開いて別のタブで他のページを閲覧すると、戻った後、瞳孔は以前とは別の場所にあります (完全に目を閉じます)。

そのiframeに絶対的に配置された要素が他にもあり、同じ問題を抱えている要素はありません.Javascriptアニメーションが原因だと思います. 誰かが同様の問題に遭遇しましたか？申し訳ありませんが、多くの理由により、ここにページを投稿できません。

生徒のアニメーションのスクリプトを投稿できます。

function eyes_sides(){
    $('.eyes').animate({
            left:parseInt($('.eyes').css('left'))-9
        },{duration:1500});
    $('.eyes').animate({
            left:parseInt($('.eyes').css('left'))
        },{duration:1000});
}

function eyes_roll(){
    $('.eyes').animate({
        left:parseInt($('.eyes').css('left'))-7,
        top:parseInt($('.eyes').css('top'))-18
      },{duration:1800});
    $('.eyes').animate({
        left:parseInt($('.eyes').css('left')),
        top:parseInt($('.eyes').css('top'))
      },{duration:1300});
    }

function animate_eyes(){
      var animation = random_number(1,2);
      //alert(animation);
      switch(animation){
        case 1:
          eyes_roll();
          break;
        case 2: 
          eyes_sides();
          break;  
      }
      var delay = random_number(4000,12000);          
      window.animateEyes = setTimeout(function(){animate_eyes()},delay);
    }

スクリプトは完璧ではありませんが、必要なことは実行します。

何が問題を引き起こしているのか考えていましたが、タブがアクティブでないときにアニメーションが実行されることに何らかの形で関連している可能性がありますか? アニメーションを停止/開始するために「onBlur」と「onFocus」を追加すると役立つでしょうか？

アドバイスをありがとう！

4

1 に答える 1

0

このコードは、アニメーションを停止することになっています。少なくともそれonblurはあなたのIFRAME. アニメーションを再開する方法を簡単に理解できます。

jQuery には詳しくありませんが、コードを「翻訳」できます。

window.onload=function (){
    var ifr=document.getElementById('your_iframe');
    (function (x){x.onblur=function (){clearTimeout(x.contentWindow.animatedEyes);return;}}(ifr));
    return; 
}
于 2012-04-17T09:13:30.460 に答える