Twitter bootstrap與infinitescroll和window.resize相關

從閱讀這個問題的幾個相關問題，我意識到沒有$.affix('refresh')方法可用於twitter引導程序添加組件 - 我的問題雖然相關，但可能甚至是一個額外的步驟之間只是一個刷新，讓我試着解釋。Twitter bootstrap與infinitescroll和window.resize相關

我有一個標準的bootstrap導航欄的頁面。下面我將貼上一個子導航，一旦用戶滾動過去的x像素「釘」（在我的情況下，導航欄的高度爲41px，因此在41px的詞綴將踢入，並通過將.affix類改爲.affix {top:41px}））

因此，對於第一個詞綴，我可以使用html-only屬性。

下一頁（本質上可以認爲是「第二頁」）我有另一塊導航應該「粘貼」並且在用戶滾動到某個位置時替換第一個子導航 - 因爲由於內容我使用js來計算第一頁的高度並根據我得到的內容設置offset: {top:xxx}，所以第二頁/詞綴的位置是可變的。

這也可以很好/如預期的那樣，用戶向下滾動一點，第一個子導航詞綴開始執行，如果他繼續滾動併到達第二個子導航欄，（它實際上並沒有取代它本身，而是具有較高的Z指數的覆蓋）

從這裏我有兩個問題，我一直沒能找到解決方案：

當用戶重新調整窗口大小時，第一頁的內容變得更長，這當然會改變我的原始偏移頂部尺寸在頁面下方。首先，我認爲對.affix('refresh')的簡單調用可能是解決方案，但當然這種方法甚至在組件上都不可用。接下來，我想我可以再次手動重新計算高度，並重新創建$('.my-second-affix').affix({offset: {top:x-new-offset}}); - 但由於某種原因，這似乎並沒有工作，我不知道爲什麼:(
下一期要解決的是，我也使用jquery infinitescroll來加載越來越多的頁面...每個頁面可能有不同階段的其他子導航，我想粘貼並取代哪個最後的粘貼現在在頂部。

注意話，我也想確保，如果用戶向後滾動的另一個方向是，之前貼子資產淨值將重新詞綴themse lves倒退（我懷疑他們會很好，只要字綴偏移是正確的）

希望這個解釋足以突出我的問題，並且某人或者已經處理過這個問題，或者可以提供一些解決方案的指導。我試圖讓偏移量是一個函數，它返回頂部的當前偏移量（如另一個問題Twitter bootstrap change affix offset中提到的），但由於某些原因無法按預期工作。

任何幫助是極大的讚賞

來源

2013-01-02 Andre

這絕不是答案，而是一種幫助。 ''.fn.affix'我有一個類似的情況（儘管與以前不同）。我不得不寫一個調整大小的函數。我建議使用'underscore'或'lodash'或編寫自己的'debounce'功能。對於減少JavaScript負載非常有用，並且可以幫助防止更改期間的匆忙。在這裏寫你自己的信息：http://davidwalsh.name/javascript-debounce-function – user1167442

如何在引導程序導航欄中添加所有不同的子導航作爲第二，第三等行，然後隱藏或顯示它們基於用戶滾動了多少？ –

你試過$('#myAffix').affix('checkPosition')。這在Bootstrap3.0中可用

來源

2015-08-13 07:14:58 vijayP

如果我理解正確，則需要計算調整大小時的偏移量。這個例子是使用jQuery 喜歡的東西：

$(window).resize(calcOffset); 

    function calcOffset() 
     { 
      var location = $("myElement").offset(); 
      var top = location.top; 
     }

來源

2015-10-21 12:18:05

我會建議你在代碼本身這樣<div class="col-md-offset-6">使用偏移。希望這是有幫助的

來源

2016-03-12 15:59:55 Manish62

這不提供問題的答案。一旦你有足夠的[聲譽]（http://stackoverflow.com/help/whats-reputation），你將能夠[評論任何職位]（http://stackoverflow.com/help/privileges/comment）;相反，[提供不需要提問者澄清的答案]（http://meta.stackexchange.com/questions/214173/why-do-i-need-50-reputation-to-comment-what-can- I-DO-代替）。 - [來自評論]（/ review/low-quality-posts/11605676） – Milap

好吧，我想我們通過互相幫助學習。我們總是通過分享我們知道的東西來學習一件事，兄弟。 – Manish62

這個問題是很老，但因爲沒有其他人已經回答了...

我有詞綴類似的問題。這是我如何解決它。

$('.affixed-elements').each(function() { 
    var topOffset = 0; //calculate your top offset here 
    var $container = //Set this to the element's container; 
    $(this).affix({ 
     offset: { 
     top: function() { 
      return $container.offset().top - topOffset; 
     }, 
     bottom: function() { 
      return $('body').height() - ($container.offset().top+$container.outerHeight()); 
     } 
     } 
    }); 
});

這些設置應該保持其容器的邊界內附着的元素調整窗口大小即使經過。

來源

2016-03-25 21:19:45