Javascript Twitter Bootstrap 轮播不滑动
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/10660718/
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 Not Sliding
提问by juminoz
I ran into an interesting issue. I'm pretty sure that the answer is very simple, but I just couldn't figure it out so I thought I look for some help.
我遇到了一个有趣的问题。我很确定答案很简单,但我就是想不通,所以我想寻求帮助。
Basically, my carousel doesn't slide. It just switches image. I even tried copying the exact HTML from the bootstrap site into my own page and it still doesn't slide. In application.js, the initialization is also has no argument.
基本上,我的旋转木马不会滑动。它只是切换图像。我什至尝试将引导站点中的确切 HTML 复制到我自己的页面中,但它仍然没有滑动。在 application.js 中,初始化也是没有参数的。
// carousel demo
$('#myCarousel').carousel()
I notice that next and prev classes are added to each item when clicking pref/next button, but it doesn't seem to do the same thing on mine. I didn't see anything wrong when I debugged either.
我注意到在单击 pref/next 按钮时将 next 和 prev 类添加到每个项目,但它似乎没有在我的身上做同样的事情。我调试时也没有发现任何问题。
What am I missing? I tested this in both latest Chrome and Safari.
我错过了什么?我在最新的 Chrome 和 Safari 中对此进行了测试。
回答by gabber12
You also have to add bootstrap-transition
for the sliding to work, like so:
您还必须添加bootstrap-transition
滑动才能工作,如下所示:
<script src="twitter-bootstrap-v2/docs/assets/js/bootstrap-transition.js"></script>
回答by elliotcw
I was having the same issue but with bootstrap v2.0.3 (which has transition bundled in), ended up adding the slide class to the carousel div
我遇到了同样的问题,但是使用 bootstrap v2.0.3(捆绑了过渡),最终将幻灯片类添加到了轮播 div
<div id="myCarousel" class="carousel slide">
then you just call:
然后你只需调用:
$('#myCarousel').carousel();
回答by R Claven
I think you need
我想你需要
$('#myCarousel').carousel('cycle');
Pls also see: How can I make the Bootstrap js carousel automatically cycle as soon as the page loads?
回答by chapman84
Here is a working example. It's probably something minor your missing. http://jsfiddle.net/chapmanc/Vza6F/1/
这是一个工作示例。这可能是你失踪的小事。 http://jsfiddle.net/chapmanc/Vza6F/1/
回答by Dan
Do you just put that JavaScript in a <script>
tag?
你只是把那个 JavaScript 放在一个<script>
标签中吗?
<script>
$('.carousel').carousel({
interval: 1000
})?;
</script>
回答by Deepinder
check the css files that you have included. Try and add the bootstrap.css file as well in addition to bootstrap.min.css. It worked for me .
检查您包含的 css 文件。除了 bootstrap.min.css 之外,尝试添加 bootstrap.css 文件。它对我有用。