不带Jquery的Javascript Carousel

Question

我正在尝试构建一个javascript carousel，就像著名的JCarousel的简单版本一样，但我根本不想使用Jquery。我为什么要这样做呢？嗯，因为我想真正学习和理解javascript是如何工作的。

我一直在寻找一个不使用库的例子，但我什么也找不到。如果有人能给我指出一些类似我需要的东西，我将不胜感激。

现在，当涉及到构建旋转木马时，基本上我的问题与列表中图像的移动有关。所以我有一个列表中的所有图像，我有左箭头和右箭头的按钮，好的，但当我触发事件时，我不知道从哪里开始，以便向左或向右移动所有图像…

有什么线索吗？

谢谢!

Answer 1

您可能会找到使用库的示例，因为其中一些内容非常密集。原理是你想要做一个非常宽的div，所有的图片都是水平排列的，然后在按下按钮时，设置div的css的左侧位置来添加或删除图片的宽度值。库非常擅长将按钮点击连接到回调函数，查询和设置元素的css，测量元素的宽度，以及操纵dom获取(例如) <li>标记列表并将其放入一个非常宽的div中。添加图形设计约束，虽然我赞赏和敬佩您手工完成它的愿望，但您将花费很长时间重新发明轮子。