如何创建iPhone联系人标题滚动效果为HTML?

Nic*_*iwi 6 html javascript css iphone mootools

我已经设置了一个基本的jsFiddle来更好地了解我想要发生的事情.

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

希望如果你想到iPhone上的iPhone联系页面,你正在查看的联系人字母表的哪个部分,以及当你滚动页面时它会如何变化,你会得到这个想法,如果没有阅读的话.

基本上,我在单列垂直滚动页面中有部分内容.当第一个标题的顶部(jsFiddle中的标题1)到达屏幕顶部时,向下滚动页面,它将粘在顶部,直到你到达下一个标题(标题2),在"标题"当你滚动时,2"将保持其位置,并且"标题1"将被推出现场,对于其余的标题也是如此.

当向上滚动页面时,反向会发生,例如......"标题4"将保持原位,当达到"标题3"内容的底部时,"标题3"将无缝地显示在"标题4"上方并保持在屏幕的顶部,直到它达到自己的内容的顶部.

我想用HTML/CSS创建这个,Mootools 1.3作为我选择的JavaScript库.

有关如何做到这一点的任何想法?干杯.

jcu*_*nod 4

我实际上没有看到你的帖子,直到有人指出我的帖子是重复的,看看这个冻结标题,直到不相关(HTML、CSS 和 JS)