jquery - 水平列表或可以根据视口大小滑动的列表

Question

我目前正在尝试创建一个有水平列表的网站。在正常视口中，我希望它们彼此相邻分组，但是一旦视口达到某个阈值，我希望列表成为轮播。这可能吗？过去几个小时我一直在寻找可能的解决方案，但找不到任何适合我需要的东西。

下图展示了我需要它做什么。

http://i.stack.imgur.com/4XqZI.png

Answer 1

您可以使用 jQuery 来查询视口大小，然后如果您处于较小的尺寸之一，则加载一个为它们设置动画的函数。

它会涉及一些 CSS，例如将您的元素说成浮动（float:left;等）并绝对定位它们，以便它们都在同一个位置 - 如果您愿意，您可以然后交叉淡入淡出。另一种方法是让它们从可见区域进入。

然后在较小的尺寸下，您只需要调用轮播函数来更改页面的 CSS 和一个函数来为其设置动画。