如何在js中制作滑动按钮答案

【问题标题】：How to make Slide buttons in js如何在js中制作滑动按钮
【发布时间】：2017-07-31 19:00:14
【问题描述】：

嘿，我正在研究一个 css 滑块，它在没有 js 的情况下工作正常，只有 css 但我想为滑块的导航按钮制作一个 js 脚本我的意思是我想制作一个可以向左或向右滑动内容的 js 脚本通过单击左或右按钮，它必须进行循环我的意思是，如果您单击一次按钮，那么它必须每次将内容向左或向右滑动 100%，并且最大宽度是我要滑动的内容的 1000% 可以任何人都请帮助我

<div class="slider-10">
<div class="slider-box" style="width: 1000%">
<img src="img/image-1.jpg" />
<img src="img/image-2.jpg" />
<img src="img/image-3.jpg" />
<img src="img/image-4.jpg" />
<img src="img/image-5.jpg" />
<img src="img/image-6.jpg" />
<img src="img/image-7.jpg" />
<img src="img/image-8.jpg" />
<img src="img/image-9.jpg" />
<img src="img/image-10.jpg" />
</div>
</div>

我想滑动这个部分：

<div class="slider-box" style="width: 1000%">
    <img src="img/image-1.jpg" />
    <img src="img/image-2.jpg" />
    <img src="img/image-3.jpg" />
    <img src="img/image-4.jpg" />
    <img src="img/image-5.jpg" />
    <img src="img/image-6.jpg" />
    <img src="img/image-7.jpg" />
    <img src="img/image-8.jpg" />
    <img src="img/image-9.jpg" />
    <img src="img/image-10.jpg" />
    </div>

请帮帮我

【问题讨论】：

为什么不直接使用可用的第三方组件，比如 Bootstrap 的轮播？ getbootstrap.com/javascript/#carousel
不，因为我正在为不懂 js 的人制作自己的滑块框架，但我希望它为我添加 js 用于滑块导航
Bootstrap 不需要太多 JS。它几乎是即插即用的。
但我讨厌 bootstrap 我想要我的框架
为什么要重新发明轮子？

标签： javascript jquery html css

【解决方案1】：

您可以在div 元素中设置任何img，这意味着每个imgtag 有1 个div，然后在js 中声明一个函数并使用onclick 事件为EX 调用它：单击右键发送1 到函数并留下一个-1。然后你可以为每个应该显示的 div 添加类。

【讨论】：