jquery - 具有多个元素的 slider

标签 jquery css layout slider

我想像在这些图片库中一样创建一个 slider 。
它应该一次显示多个条目,如下图所示:

http://i.stack.imgur.com/nTBPw.png (@ILMV 不好意思,我不能自己放..)

当我点击右箭头时,它应该向左滑动(“类似 iPhone”),以便您看到 5、6、7 和 8。
条目(按数字成像)是动态创建的。

<div>
    <ul>
        <li>1</li>  <!-- ← visible -->
        <li>2</li>  <!-- ← visible -->
        <li>3</li>  <!-- ← visible -->
        <li>4</li>  <!-- ← visible -->
        <li>5</li>  <!-- ← not visible -->
        <li>6</li>  <!-- ← not visible -->
        <li>7</li>  <!-- ← not visible -->
        <li>8</li>  <!-- ← not visible -->
    </ul>
</div>

我知道 slider 的工作原理并且能够自己创建一个,但我不知道如何创建该 (CSS-) 布局..

提前致谢

编辑 明确一点:订单是相关的,因为我想构建一个“我们所有客户”的网格状 View ,这些 View 按他们的头衔排序。

最佳答案

多元素循环插件

提供一个简单的列表项预览滚动面板。从中间显示给定范围的 li 项(隐藏边缘项)并允许在列表中左右滚动。不处理自动滚动或环绕元素。

https://github.com/willrossi/jQuery-Multiple-Elements-Cycle

关于jquery - 具有多个元素的 slider ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3546258/

相关文章:

javascript - D3 : how to disable zoom on icons with background image?

javascript - 悬停时更改字形图标( Bootstrap )

html - 像网格一样排列多个复选框。没有 table ?

javascript - 网络和物理单位

html - 如何防止正文滚动但允许滚动内容并将页脚留在底部?

脚本 : Line is executing even after return false

javascript - AngularJS:ng-keypress 不工作

jquery - MooTools 版本的 jQuery 命名空间事件?

jquery - Select2 允许重新选择相同的值

javascript - 如何制作一个在小屏幕上可切换但在大屏幕上始终可见的元素