預先安裝一個div而不會將內容向下移動？使用iScroll

我有一個容器div與一堆可滾動內容（對於我使用iScroll的記錄 - 如果這改變了解決方案）。當我滾動到頂部時，我想在當前滾動位置上方加載內容。如果我簡單地使用jQuery prepend（）;「我的可滾動區域中的內容向下移動。理想情況下，我們希望將當前內容保留在框架中，並使可滾動區域在內容上向上成長。預先安裝一個div而不會將內容向下移動？使用iScroll

有什麼想法？

謝謝！

來源

2012-08-17 PotatoFro

根據the iScroll website，它有一個叫做scrollToElement方法：

scrollToElement(el, runtime)：滾動到滾動區域內的任何元件。 el必須是CSS3選擇器。例如：scrollToElement("#elementID", '400ms')

如果你總是在前面加上的div個固定金額（例如總是一個div），我想你可以用它來滾動到（例如）第二個元素你已經預先考慮新的右後內容：

// ... (prepend new content) 
myScroll.scrollToElement('#scroller :nth-child(2)', '0ms');

我還沒有試過這個，所以請讓我們知道這是否適合你。

來源

2012-08-17 22:43:19 PPvG

感謝您的回覆！這個方法最終給我們一個（非常快）的延遲時刻，然後再回到我們原來的滾動位置，並且看到用戶可能沒有完全排列使用的元素，我們也看到了滾動位置的微小移動。 – PotatoFro 2012-08-17 23:18:56

通過iScroll的源快速瀏覽後，這裏就是我發現：

目前x和y總是可以通過myScroll.x和myScroll.y。
iScroll具有內部函數_offset(el)，它返回任何給定元素的left和top偏移量。

這基本上打開了兩個解決方案：

使用_offset(el)。雖然可能，但這是不可取的。下劃線是用於標記「私人」功能的慣例，意思是說，它不是官方API的一部分。

或

使用新添加元素的高度：

var x = myScroll.x; 
var y = myScroll.y; 

// ... (prepend new content) 
y += $('#scroller :first-child').outerHeight(); 

myScroll.scrollTo(x, y, '0ms');

您可能需要通過true到.outerHeight()，這使得它包括利潤。

再一次，我沒有測試過這一點，所以請讓我們知道，如果它的工作原理。

來源

2012-08-18 00:20:00 PPvG

預先安裝一個div而不會將內容向下移動？使用iScroll

回答

相關問題