我是一名自助新手,我的编程技巧非常基础。我想开发一个带引导程序的小型投资组合网站。但是我遇到了一个小问题:有没有办法在引导转盘的每个图像之间加一个10 px的小间隙?
非常感谢任何帮助。
谢谢
答案 0 :(得分:0)
您可以直接设置引导类的样式。
var items = document.getElementsByClassName('item');
var timer = setInterval(function() {
for(var i = 0, len = items.length; i < len; i++) {
if(items[i].classList.contains('active')) {
items[i].classList.remove('active');
if(i+1 >= len) {
items[0].classList.add('active');
}
else {
items[i+1].classList.add('active');
}
}
}
}, 3000);
&#13;
#carousel img {
padding: 10px;
}
&#13;
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<div id="carousel" class="carousel slide" data-ride="carousel">
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<div class="item">
<img src="http://placecage.com/1000/1000" alt="...">
<div class="carousel-caption">
</div>
</div>
<div class="item">
<img src="http://placecage.com/750/1000" alt="...">
<div class="carousel-caption">
</div>
</div>
<div class="item active">
<img src="http://placecage.com/gif/1000/1000" alt="...">
<div class="carousel-caption">
</div>
</div>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
&#13;