ブートストラップタブにスクロールしてdivをアニメ化する

Question

私はJQueryとjavascriptの初心者です。問題解決のために一日中苦労しています。私はあなたの誰かが助けになるかもしれないと願っています。 私は、ビューポートの高さの半分が宣言されたクラスを通過したので、いくつかのボックスを表示させようとしています。 は、私はしばしばそれを動作させるために、このコードを使用します。

$(window).scroll(function() { 
    homeSlide(); 
}); 
function homeSlide() { 
    var wScroll = $(window).scrollTop(); 

    if($('.prev-div').offset().top - $(window).height()/2 < wScroll) { 

    $('.boxes').each(function(i) { 
     setTimeout(function() { 
     $('.boxes').eq(i).addClass('bounce-in');}, 100 *i); 
    }); 
    } 
} 

それは常に、従来のHTML・CSSのコンテンツに取り組んでいます。今はうまくいかない、うまく動作しますが、ページが読み込まれるとすぐに、スクロールしてすぐには動きません。私はブートストラップ ".tab-content"の内部で起こっているからだと思います。それで、私が目的のポイントに近づくにつれて機能を動作させるために、 ".active .tab-pane"をどのように参照するのですか？ 私はあなたの助けを借りてこの問題を解決できると思っています。
あなたのサポートのためにThanx。

編集：ここでは、JsFiddleに希望する効果の簡単な表現をアップロードしました。ここにはlinkがあります。

「ブートストラップの.tab-コンテンツ」の外では動作しますが、その内部では動作しないとはどういう意味ですか、私は機能をオフセットする必要があると思います。何度も繰り返しましたが、肯定的な結果は得られませんでした。

Answer 1

は、それはすべきではない>の代わりに、<

場合（$（ '前へ-DIV。'）（オフセット）トップ - 。。$（ウィンドウ）.height（）/ 2> wScroll）

Answer 2

私は最終的に問題を解決する方法を見つけました。「if」文で$(window)を$('a[data-toggle="tab"]')に置き換える必要がありました。

function homeSlide() { 
    var wScroll = $(window).scrollTop(); 

    if($('.prev-div').offset().top - $('a[data-toggle="tab"]').height()/2 < wScroll) { 

    $('.boxes').each(function(i) { 
     setTimeout(function() { 
     $('.boxes').eq(i).addClass('bounce-in');}, 100 *i); 
    }); 
    } 
} 

とにかく、別のタブをスクロールするとアニメーションが発生するため、解決できない問題がもう1つあります。そこに解決策はありますか？