固定div一旦頁面滾動閃爍

Question

我想要一個廣告塊/ div將切換到固定位置，一旦你向下滾動頁面。

這裏是什麼，我試圖做一個演示，我使用做它的代碼...

http://jsfiddle.net/jasondavis/6vpA7/3/embedded/result/

在它完美的演示如何，我想它是，但是當我在我的實時網站上實現它時，http://goo.gl/zuaZx它可以工作，但是當您在每個滾動中向下或向下滾動div時，按下或向下滾動按鈕即可。我的網站上看到了住的問題是，上面寫着「推薦書」

這裏是我使用的代碼在右側欄中塊...

$(document).ready(function() { 

    $(window).scroll(function() { 
     if ($(window).scrollTop() > $('#social-container').offset().top) 
      $('#social').addClass('floating'); 
     else 
      $('#social').removeClass('floating'); 
    }); 

});​ 

CSS

#social.floating { 
    position: fixed; 
    top: 0; 
}​ 

我的演示jsfiddle它可以正常工作 http://jsfiddle.net/jasondavis/6vpA7/3/

我的現場唯一不同的是div/id名稱是不同的。正如你所看到的，它在我的實時網站上有些作用，除了當你向下滾動頁面時閃爍和閃爍。

任何人有任何想法，爲什麼這會發生在我的生活網站上，而不是我的jsfiddle演示？

Answer 1

你會注意到在示例代碼和你的jsFiddle中，你的內部div（#social,#text-2等）有一個包裝器/容器div，這是執行scrollTop()測試的地方。在你的實時代碼中，你已經忽略了這個包裝，並且你正在檢查scrollTop()並在同一元素上設置浮動類（#text-2）。所以每次滾動時，都會在類之間交換，因爲scrollTop()條件會一直檢查相同的元素。您需要將#text-2換成另一個div，然後對其執行條件處理，就像在您的示例中一樣。

另外，#text-2是li元素，但沒有父母ul。您應該給它一個父母ul或將其更改爲div，否則它是無效的HTML。