这可能吗?滚动幻灯片到关键点,例如垂直分页

问题描述 投票:0回答:3

假设我有一个带有垂直“幻灯片”的网站。它们每个都占据了屏幕的很大一部分。有没有什么干净的方法可以将垂直分页添加到滚动中?例如,如果滚动到页面上特定水平点附近,页面将滑动,以使该部分的顶部边框与窗口顶部完全重合?

我希望在网络应用程序中添加类似于 iPhone 的“垂直分页”功能。我将如何去做这件事,有什么干净的方法可以做到这一点吗?

这里是iPhone垂直分页的例子...

http://www.youtube.com/watch?v=bgCcSF2Ip64

(抱歉视频质量较差,我找不到任何其他垂直分页的示例)

我当前的网站看起来像这样,有一个可以滚动到的垂直窗格。但如果我有分页功能,当您滚动时,它会将您锁定到最近的垂直“窗格”。

http://www.nikebetterworld.com/

(另外,Nike better world 是一个很棒的网站)

javascript scroll pagination
3个回答
5
投票

Sencha touch 允许在他们所谓的“轮播”中实现此功能,请点击此链接查看其实际演示。

http://dev.sencha.com/deploy/touch/examples/kitchensink/

单击“用户界面”,然后单击“轮播”,注意垂直和水平滚动。它使用面板,并且对于触摸屏来说肯定更好,但对于鼠标交互来说不是很好。无论如何,这些面板是非常可定制的。祝你好运。


1
投票

嗯,您正在谈论触摸界面与桌面界面。如果您想在 iPhone 上实现这一目标,您可以通过粘合和按摩很多东西来实现这一目标。 http://jqtouch.com/ 是一个 jQuery 插件,为移动浏览器提供了一些不错的钩子。

您实际上是在管理 X 和 Y 滚动的方式和时间。分页可以是像 div 或 li 这样的容器元素。欢迎添加更多想法...


0
投票

您可以做的是禁用滚动,但捕获滚动事件并相应地移动内容。

© www.soinside.com 2019 - 2024. All rights reserved.