创建显示上一个和下一个图像的一部分的图像滑块答案

【问题标题】：create image slider that shows part of previous and next image创建显示上一个和下一个图像的一部分的图像滑块
【发布时间】：2012-03-30 09:53:37
【问题描述】：

我正在尝试使用 jQuery 创建幻灯片（类似于 jquery scrollhorz），但我希望部分显示上一张和下一张图像。

现在，我拥有的是一个 div（隐藏了溢出），其中包含我拥有的所有图像。当按下上一个或下一个按钮时，我将整个 div 向左或向右设置动画。问题是，如果我将许多图像加载到 div 中，它就会变得迟钝且缓慢。

实现此图像滑块的最佳设计是什么？

【问题讨论】：

【解决方案1】：

无需进入所需的代码，我的建议是使用 jquery（或 moo，如果那是你的东西）来维护一个 3 到 5 个图像长的 div，并保留一个你想要显示的所有图像的 url 列表.当您向左或向右滑动图像时，您会弹出另一端的图像并将相应的图像添加到另一侧。

您可以使用相同的技术无缝地遍历列表。

【讨论】：

如果我从一端弹出一个图像并将新图像添加到另一端，我将如何制作从左到右或反之滚动的动画？
使用内部 div 来容纳大于容器（视口）的图像，然后像现在一样移动整个内部 div。视口只会被隐藏溢出。
这就是我现在正在做的事情。每当我有太多图像时，它就会变慢。我认为问题在于图像很大并且调整大小以适合容器（这是我的设置）。感谢您的帮助
如果您使用 jquery 在滚动时从内部 div 中删除图像，那么您永远不可能在其中包含“太多图像”。您只会拥有您指定的号码。
示例：用户点击“向左滚动”。您将 div 滚动到适当的位置，然后使用 jquery 完全删除最右边的图像。然后，您使用 jquery 将列表中的下一个图像添加到最左侧。图片已经滑过去了，你可以看到旁边的图片，而你的内部 div 仍然只有你想要的图片数量。

【解决方案2】：

试试这个。

符合你的描述....希望对您有所帮助:)

这也可能是一个解决方案。 http://jsfiddle.net/JCQ6Q/15/
如果对您有帮助，请投票:) 祝您一切顺利

【讨论】：