twitter-bootstrap Twitter Bootstrap 轮播不会在悬停/鼠标悬停时暂停
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/13224586/
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
Twitter Bootstrap carousel is not pausing on hover/mouse-over
提问by Doug Smith
Code:
代码:
<html>
<head>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/css/bootstrap.no-icons.min.css" rel="stylesheet">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/js/bootstrap.min.js"></script>
<script>
$(document).ready(function(){
$('#welcome-carousel').carousel({
interval: 5000,
});
});
</script>
</head>
<body><div style="width:600px;margin:auto;">
<div id="welcome-carousel" class="carousel slide"><!-- class of slide for animation -->
<div class="carousel-inner">
<div class="item active"><!-- class of active since it's the first item -->
<img src="img/image1.png" alt="" />
</div>
<div class="item">
<img src="img/image4.png" alt="" />
</div>
<div class="item">
<img src="img/image3.png" alt="" />
<div class="carousel-caption">
<p>Hello to the WORLD!</p>
</div>
</div>
<div class="item">
<img src="img/image2.png" alt="" />
</div>
<div class="item">
<img src="img/image1.png" alt="" />
</div>
</div><!-- /.carousel-inner -->
<!-- Next and Previous controls below
href values must reference the id for this carousel -->
<a class="carousel-control left" href="#welcome-carousel" data-slide="prev">‹</a>
<a class="carousel-control right" href="#welcome-carousel" data-slide="next">›</a>
</div>
</div>
<p>hey</p>
</body>
If I hover over the slideshow, it won't stop the slideshow. Why?
如果我将鼠标悬停在幻灯片上,它不会停止幻灯片。为什么?
回答by nickhar
Try (in your case):
尝试(在你的情况下):
$(document).ready(function(){
$('#welcome-carousel').carousel({
interval: 5000,
pause: "hover"
});
});
As per docs at: http://twitter.github.com/bootstrap/javascript.html#carousel
根据文档:http: //twitter.github.com/bootstrap/javascript.html#carousel
回答by Yohn
we just found a bug within the carousel with bootstrap 2.2.1 where the carousel doesnt pause on hover when you mouseover the carousel in the middle of a slide / transition. You can see more on this issue here - https://github.com/twitter/bootstrap/issues/5747
我们刚刚在 bootstrap 2.2.1 的轮播中发现了一个错误,当您将鼠标悬停在幻灯片/过渡中间的轮播上时,轮播不会在悬停时暂停。您可以在此处查看有关此问题的更多信息 - https://github.com/twitter/bootstrap/issues/5747

