引導「詞綴」不會貼上印

我在這裏創造一個例子權：http://jsfiddle.net/Ninjanoel/9GEGU/引導「詞綴」不會貼上印

基本上，我想貼上東西的權利，在這種情況下，紅色的盒子，我希望它似乎只是在發生正確數量的頁面滾動時將自己固定在頂部，但每次「粘貼」時，它都跳到左側，與我已經在左側的內容重疊。

bootstrap具有如此大量的文檔，但不幸的是我想我錯過了一些關於此的東西。請幫忙。

var offsetFn = function() { 
    return $('#sidebar').position().top; 
} 

$(document).ready(function(e) { 
    $('#sidebar').affix({ 
     offset: {top: offsetFn} 
    }); 
});

的代碼片段我在堆棧溢出發現不用猜頂偏移值，但即使我給它一個簡單的值，當DIV成爲它貼左跳。

關於小提琴的注意事項：它看起來並沒有很好地工作，至少我的硬盤上的版本跳轉了，但它基本上是我使用的代碼，並且小窗口大小可能會變得複雜東西，綠色和紅色框假設爲垂直列

來源

2012-12-02 Nnoel

爲側邊欄創建內部div。 Affix將position: fixed設置爲列，因此無法使用。

編輯：請參閱http://jsfiddle.net/9GEGU/2/和你的功能是不必要的，只會在FF中造成奇怪的行爲，所以刪除{offset: {top: offsetFn}}。它看起來一樣，但滾動會更順暢。

還將span5（290px）的寬度設置爲#sidebar，因爲當元素具有position: fixed時，它將從文檔流中移除並且不受父寬度的限制。

來源

2012-12-02 23:54:49

謝謝Jan，我設置了'{top：0}'，它可以工作，但盒子的寬度不斷變化。我在這裏有一個例子：http://jsfiddle.net/9GEGU/4/，我用css'＃sidebar.affix {width：290px;}'設置寬度，它在一些頁面寬度上工作，但是在其他人不正確。你回答我的原始問題，謝謝。 – Nnoel

除了設置固定寬度外，您還可以將類'span5'添加到內側邊欄，並清除左邊距。請參閱http://jsfiddle.net/9GEGU/5/ –

請參閱http://twitter.github.com/bootstrap/assets/css/docs.css bootstrap文檔如何使用媒體查詢來更好地理解詞綴的工作原理。 –

引導「詞綴」不會貼上印

回答

相關問題