twitter-bootstrap 如何在 Bootstrap Carousel 中使用数据暂停属性
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17523385/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to use data-pause attribute in Bootstrap Carousel
提问by Alex
In Bootstrap carousel I want to disable pause on mouse over using data attribute is it possible. I am also trying to set data-interval but both doesn't work. However it works using JavaScript but i want to use it trough using data attribute.
在 Bootstrap carousel 中，我想使用 data 属性禁用鼠标悬停是否可能。我也在尝试设置数据间隔，但两者都不起作用。但是它使用 JavaScript 工作，但我想通过使用数据属性来使用它。
Options can be passed via data attributes or JavaScriptz. For data attributes, append the option name to data-, as in data-interval=""
选项可以通过数据属性或 JavaScriptz 传递。对于数据属性，将选项名称附加到 data-，如 data-interval=""
- From Bootstrap official site.
- 来自 Bootstrap 官方网站。
Thanks in Advance. JavaScript -
提前致谢。JavaScript -
<script type="text/javascript">
$(function(){
$("#myCarousel").carousel();
});
</script>
HTML -
HTML -
<div class="container">
<div id="myCarousel" class="carousel slide" data-interval="2000" data-pause="false">
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<!-- Carousel items -->
<div class="carousel-inner">
<div class="active item"><img src="http://twitter.github.io/bootstrap/assets/img/bootstrap-mdo-sfmoma-01.jpg" alt=""></div>
<div class="item"><img src="http://twitter.github.io/bootstrap/assets/img/bootstrap-mdo-sfmoma-02.jpg" alt=""></div>
<div class="item"><img src="http://twitter.github.io/bootstrap/assets/img/bootstrap-mdo-sfmoma-03.jpg" alt=""></div>
</div>
<!-- Carousel nav -->
<a class="carousel-control left" href="#myCarousel" data-slide="prev">‹</a>
<a class="carousel-control right" href="#myCarousel" data-slide="next">›</a>
</div>
</div>
回答by Scott Drinkwater
Put this into div of the whole carousel
把它放到整个轮播的 div 中
<div id="myCarousel" class="carousel" data-pause="false">
回答by Alan Marvel
This is a little late, but I think it might benefit other people. I believe the problem is because you're trying to mix data attributes with JavaScript. Instead of adding the pause option as a data attribute, add it when you invoke the carouselfunction:
这有点晚了，但我认为它可能会使其他人受益。我相信问题是因为您试图将数据属性与 JavaScript 混合使用。不要将 pause 选项添加为数据属性，而是在调用carousel函数时添加它：
$(function(){
$("#myCarousel").carousel({
pause: false
});
});
You may have to do it with the interval data attribute as well.
您可能还必须使用间隔数据属性来执行此操作。
