如何使用javascript实现轮播？

Question

！ 图片从左向右滚动，当它悬停在区域的中间时，它将变得像原始一样大，当它通过中间位置时，它会越来越小并消失。 有没有人知道如何使用JavaScript实现这项工作？任何参考文献将不胜感激。

Answer 1

你实际上是在请求某人向你解释旋转木马的许多方面是如何工作的。该级别详细信息的最佳选项是您找到一个现有的实现并进行分析。

概念上，轮播行为包括：

1. 加载大量图片。
2. 添加事件处理程序以响应鼠标事件。
3. 检测某些鼠标事件并触发滚动动画的开始。
4. 创建动画以显示翻译图像并更改其大小的动作。
5. 动画和更改大小有几种不同的方法。这可以使用CSS3或jQuery的动画库或使用普通javascript中的计时器来完成，同时操作图像的位置和缩放大小。
6. 当其他图像向外滚动时，将新图像旋转到视图中。

Answer 2

我认为你可以在jQuery中使用animate函数。以下是我很久以前写的一段代码。但是你应该改变一些。'3000'意味着毫秒。     $（function（）{$（“body”）。click（function（）{$（“＃panel”）。animate（{left：“500px”，height：“200px”}，3000）.animate（{top ：“200px”，身高：“100px”}，3000）.animate（{left：“0px”，身高：“200px”}，3000）.animate（{top：“0px”，身高：“100px”}， 3000）}）;}）;