Javascript 如何使额外的div块作为滑块工作

我有Bootstrap3页面，第一次加载页面时只显示一个div。当我点击“打开下一块”按钮时，另一个div显示，如果我点击第二个div，第三个div显示。这样，我总共有6个div要展示

问题是当有超过3个div时，它会转到我不想要的第二行。 我正试图使这项工作作为一个滑块。 当有超过3个div块时，是否可能使最左侧的div块隐藏并显示新的div块？比如，如果第4部分显示第1部分隐藏，如果第5部分显示第2部分隐藏

另外，当我单击左箭头按钮时，左div块将逐个显示，右div隐藏？ 主要是它应该作为一个滑块，一个一个div移动

当前jQuery：

$("#block-1").click(function() {
    $('#block-2').show();
});
$("#block-2").click(function() {
    $('#block-3').show();
});
$("#block-3").click(function() {
    $('#block-4').show();
});
$("#block-4").click(function() {
    $('#block-5').show();
});
$("#block-5").click(function() {
    $('#block-6').show();
});

---

我为英语不好感到抱歉，并提前表示感谢

引导行只有12列。如果将每个块的宽度设置为四列，则每行只能有三列。将它们的列更改为2，以便一行中有六个。 这个

需要

col-xs-2 col-sm-2 col-sm-2 col-md-2 col-lg-2

至于滑块，有更好的方法可以做到这一点，但这是你想要的吗？递增一个变量以跟踪您所在的块，然后使用“后退”按钮关闭该块

---

但我需要它们有类似的滑块：（我不太清楚你的意思。你想要一行div，当点击最后一个div时，它会递增，对吗？然后一个按钮会递增回来？为什么不让一个按钮递增，一个按钮会递减？实际上，当你点击第三个div时，第一个div会隐藏在左侧，一行中会有div 2、3和4。这是冗余的：col-xs-2 col-sm-2 col-sm-2 col-md-2 col-lg-2，您只需要xs-2，它与.container或父容器的百分比相同

col-xs-2 col-sm-2 col-sm-2 col-md-2 col-lg-2