创建图像滑块，显示上一个和下一个图像的一部分 [英] create image slider that shows part of previous and next image

问题描述

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

I'm trying to create a slideshow using jQuery (similar to jquery scrollhorz) but I want the previous and next image partly shown.

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

Right now, what I have, is a div (with overflow hidden) containing all the images I have. When previous or next button is pressed, I animate the whole div either to left or right. The problem is, if I have many images loaded into the div, it becomes laggy and slow.

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

What is the best design to implement this image slider?

推荐答案

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

Without going into the code required, my suggestion would be to use jquery (or moo if that's your thing) to maintain a div that is three to five images long, and keep a list of urls to all the images you want displayed. When you slide the images left or right, you'll pop off the image on the opposite end and add the appropriate image to the other side.

您可以使用相同的图像无缝循环遍历列表的技术。

You could use the same technique to loop through the list seamlessly.

这篇关于创建图像滑块，显示上一个和下一个图像的一部分的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！