2011-07-19 8 views
1

私は簡単なFacebookタブを構築しています。ユーザーがそれらとやりとりするまで、setIntervalとJQueryの助けを借りて3秒ごとに変わる2つのタブがあります。彼らは切り替えをキャンセルします。Facebook iframeのJquery、setIntervalに問題があります

$(document).ready(function() { 

    $('#item2').hide(); 
    $('li#tab1').addClass('selected'); 

    var timer = setInterval(function() { 
     $('div.item').fadeToggle('fast') 
     $('li.tab').toggleClass('selected') ; 
    }, 3000); 


    $(window).blur(function(){ 
     clearInterval(timer) 
    }) 

    // setup. Set the first tab to selected 
    $('li.tab').click(function(event) { 
     clearInterval(timer); 
     $('li.tab').toggleClass('selected') 
     $('div.item').fadeToggle('fast') 
    }); 

}); 

これはうまく動作します...ほとんど。この問題は、ページに長時間(2〜3分)フォーカスを失って元に戻ってから、しばらくの間、タブが非常に早く切り替わり、正常に戻ったときに発生します。 iframeにiframeがないとこの問題を解決できます:

$(window).blur(function(){ 
    clearInterval(timer) 
}) 

スイッチを完全に停止します。しかし、これは、ページがFacebook上のiframeの内側にある場合は機能しません。誰もが解決策を提案できますか?

+0

'$(parent.window)'は​​機能しますか? (手がかりなし、ちょっと考えて) –

+0

そう思わない –

答えて

1

setIntervalの代わりにsetTimeoutを使用してみてください。

function doStuff(){ 
    //do some stuff 
    setTimeout(doStuff, timeout); 
} 

setTimeout(doStuff, timeout); 

この方法では、あなただけの一回の反復をバックグラウンドで行く持っているので、ユーザーはバックページ(彼は気づいていないことをうまく行けば十分な速さ)に切り替えたときには、一度すぐに点滅します。

関連する問題