你怎麼做一個固定的，響應側邊欄？

Question

這個網站有一個美麗的側邊欄：http://thenextweb.com/ 我知道如何在CSS固定的側邊欄，但是使它停止在某一點上滾動，我迷路了。並讓它消失在一定的寬度是我認爲的媒體查詢？

Answer 1

試試這個腳本

<script> 

$(document).ready(function(){ 
    $('#page').scroll(function(){ 
    if(document.getElementById("page").scrollTop > 100) { 
     $('#sidebar').css("position","fixed"); 
    } 

    }); 



}); 

如果頁面是被包含的元素

Answer 2

我做了一個CodePen與固定在其相關容器中的側欄。

你可以在這裏看到：http://codepen.io/tomanagle/pen/vGaEvG

至於使它消失在某個轉折點。使用媒體查詢。

@media screen and (max-width: 1280px){ 
    aside{ 
    display: none; 
    } 
    #article{ 
    margin: auto; 
    float: none; 
    } 
} 

還有，你可以使用，使粘側邊欄庫：http://leafo.net/sticky-kit/