Animate div滾動到引導標籤

我是一個真正的初學者與JQuery和JavaScript，我一直在努力尋找解決我的問題一整天。我希望你們中的某個人可能會有所幫助，但這不應該很難。我試圖讓一些框出現，因爲視口高度的一半已經通過了一個聲明的類。我經常用這個代碼，使其工作：Animate div滾動到引導標籤

$(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。我如何說它在「Bootstrap的.tab-content」之外工作，但不在其內部，我想我需要抵消我的功能，我試過了一遍又一遍，但沒有獲得積極的結果。

來源

2016-09-01 Rusvelt2000

你可以給更多的上下文，或者可能是一個jsfiddle？你正在嘗試設置動畫的'.boxes'類嗎？ –

我一回家就會上傳更多信息。無論如何，我錯了，說它不工作，它的工作原理，但動畫一開始加載頁面，而不是當我靠近它滾動 – Rusvelt2000

它不應該是>而不是<

如果（$（ '上一頁-DIV。'）偏移（）頂 - $（窗口）.height（）/ 2> wScroll）

來源

2016-09-02 14:38:50 jp1871

不，它不會那樣工作。代碼是正確的，它始終在其他所有以前的網站上都有效，這僅僅是因爲它是「Bootstrap的.tab-content> .tab-pane」的一部分。 – Rusvelt2000

我終於找到了自己解決問題的解決方案：有必要在「if」語句中用$('a[data-toggle="tab"]')替換$(window)。

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); 
    }); 
    } 
}

無論如何，現在還有一個問題我無法解決，因爲動畫會在我滾動另一個選項卡時觸發。有沒有解決方案？

來源

2016-09-06 17:48:48 Rusvelt2000

Animate div滾動到引導標籤

回答

相關問題