如何保持一個div的內容始終可見，儘管移動滾動條上下

我想在http://www.kahuna-webstudio.fr/複製左側導航欄。如果你看看http://www.kahuna-webstudio.fr/，並向下滾動約50個像素左右，你會看到一個div出現斷到有它的一些導航屏幕的左側。我有大部分工作，感謝您在stackoverflow的一些人的幫助。但是我沒有工作的一部分是，當你向下滾動時，我的div，圖像的內容不會保持靜止（或始終可見）。如何保持一個div的內容始終可見，儘管移動滾動條上下

所以我想要發生的是：當div出現在屏幕的左側，當用戶向下滾動時，我希望div的內容總是出現在視圖中。

現在我工作的是： through animate（）我將左導航div的高度設置爲文檔高度，寬度增加到80像素，然後是一些圖像fadeIn（）。但是頁面相當長，當用戶向下滾動時，他們也可以向下滾動左側導航div的高度;而且我總是希望左側導航的內容始終顯示給用戶。

我覺得這個人發佈一個類似的問題（Keeping a header always in view），但我發現很難，如果我的示例代碼連接。誰能幫忙？我非常感激。

這裏是我的代碼：

$(window).scroll(function(){ 
    var wintop = $(window).scrollTop(); 
    var docheight = $(document).height(); 
    var winheight = $(window).height(); 

    var newwidthgrow = 80; 
    var smallheight = 0; 
    var smallwidth = 0; 


    if((wintop > 296)) { 
    $("#slidebottom").stop().animate({height:docheight +"px"},'fast',function(){ 
     $("#slidebottom").stop().animate({width:newwidthgrow + "px"},'slow',function(){ 
     $("#slidebottomContents").fadeIn(); 
     }); 

    }); 
    } 

    if((wintop < 25)) 
    { 
    $("#slidebottom").stop().animate({height:docheight +"px"},'fast',function(){ 

     $("#slidebottomContents").fadeOut(function(){ 
     $("#slidebottom").stop().animate({width:smallwidth + "px"});          
     }); 

    }); 

    } 


});

來源

2013-08-18 Ramona Soderlind

嘗試添加一些CSS的左格「的位置是：固定;」也許？？？ – Malcolm

我會試一試。謝謝。 –

就我而言，這隻能由CSS覆蓋。爲了讓你可以將下面的CSS相同位置的div：

CSS：

div id { 
position: fixed; 
left: 0px 
width: 'your width' 
}

位置固定在凍結你想要的位置的股利。 left讓div位於頁面的左側。

這是否回答您的問題並解決您的問題？如果不讓我知道！

來源

2013-08-18 21:06:17 user2676260

謝謝！有效！我很感激！祝你今天愉快！ –

如何保持一個div的內容始終可見，儘管移動滾動條上下

回答

相關問題