图像滑块,如此普遍的需要,但有时很难找到。有很多用JQuery制作的好的滑块。有些很难使用,有些则不然。有些只能做你需要的一部分,而另一些则非常庞大,很难定制。在这篇文章中,我打算用不到50行代码(HTML, JS和CSS)向你展示如何构建一个简单的滑块,你可以在你的项目中使用。代码可以很容易地扩展与JavaScript/JQuery,并通过简单的CSS可以定制,以适应div或全屏(正如这个例子显示,这是我的需要)。这是五分钟图像滑块!代码中包含了注释来解释发生了什么。
所提供的图片并不属于我,而是在必应上快速搜索的结果。这些应该被替换为你自己的图像。除了……
本代码发布的目的是希望它会有用,但不提供任何保证;甚至没有对适销性或适合某一特定目的的默示保证。在IE9和ie10中测试过,但应该可以在大多数/所有现代浏览器中工作。
< !DOCTYPE html>![]()
![]()