howto創建iPhone聯繫人頭文件滾動效果html？

Question

我已經設置了一個基本的jsFiddle來給出我想要發生的更多想法。

http://jsfiddle.net/nicekiwi/p7NaQ/2/

希望，如果你在你正在尋找聯繫人的字母是什麼節的角度來考慮的聯繫頁面上的iOS的iPhone和它如何改變你滾動，你會在頁面得到的想法，如果沒有閱讀。

基本上，我在一個列垂直滾動頁面內有部分內容。當第一個標題的頂部（jsFiddle中的標題1）到達屏幕的頂部時，向下滾動頁面，它會粘在頂部，直到到達下一個標題（標題2），點「標題2「將在您滾動時保持其位置，並且」標題1「將被推出網站，以此類推其餘的標題。

當向後滾動頁面時，會發生相反的情況，例如：「標題4」將保持原狀，當「標題3」內容的底部到達時，標題3將無縫地出現在標題4之上「並保持在屏幕的頂部，直到它達到其內容的頂部。

我想用Mootools 1.3作爲我選擇的JavaScript庫在HTML/CSS中創建它。

有關我如何做到這一點的任何想法？乾杯。

Answer 1

我居然沒看到您的帖子，直到有人指出挖掘出爲重複，看看這個Freeze Header until Irrelevant (HTML, CSS and JS)