javascript - 在触摸滚动条中居中文本

Question

我修改了一个版本的iScroll触摸滚动条。它是根据您下载库时示例文件中的轮播演示修改的。

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

我到达了第一个文本元素，但它仅将文本中心居中完毕。我通过简单地添加边距来做到这一点 margin:0 250px.

修改后的滚动条示例在这里:http://jsfiddle.net/egfx/5TswV/2/show/

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

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

我的分辨率:1600x1200

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

谢谢。

Answer 1

这是您的问题:您的 Li 比您的容器小，如果您找到使 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())});