在触摸滚动条中居中文本

时间:2011-10-27 00:38:36

标签: javascript html css touch scroller

我修改了iScroll触摸卷轴的版本。当您下载库时,它会根据示例文件中的轮播演示进行修改。

我需要将滚动浏览每个项目时显示的文本居中,当它到达列表末尾时,它应该正确循环回到第一个项目。这是默认行为。

我得到了第一个文本项的居中位置,但它只将文本居中放在当前所选项目中,当选择另一个项目时,它会打破文本居中,这也会在列表为时将快照恢复为第一个元素效果完成。我这样做只需添加一个保证金 margin:0 250px

模块化滚动条的示例如下:http://jsfiddle.net/egfx/5TswV/2/show/

错误代码:http://jsfiddle.net/5TswV/3/

图书馆在这里:https://github.com/cubiq/iscroll/tarball/master

我的决议:1600x1200

我正在寻找适合任何容器和res的可伸缩解决方案。

感谢。

1 个答案:

答案 0 :(得分:1)

这是你的问题:你的李小于你的容器,如果你找到一种方法使li的宽度与容器相同,一切都将正确对齐。

http://fiddle.jshell.net/5TswV/5/show/

http://fiddle.jshell.net/5TswV/5/

使用jQuery:

$('#scroller li').width($('#wrapper').width());
$(window).resize(function(){$('#scroller li').width($('#wrapper').width())});