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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 02:24:53  来源:igfitidea点击:

Twitter Bootstrap Carousel Not Sliding

javascriptimagetwitter-bootstrapslideshowcarousel

提问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-transitionfor 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

回答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 文件。它对我有用。