繁体   English   中英

Bootstrap Carousel无法在Google Chrome浏览器中运行

[英]Bootstrap Carousel won't work in Google Chrome

在过去的几周中,我一直在使用carousel bootstrap插件,没有任何问题。 就在最近,它不起作用。 我已经在Firefox上尝试过了,效果很好。 我看到了这个问题,并尝试了所有建议的方法,但仍然无法正常工作。 我删除了所有不同的脚本和CSS导入,并尝试仅使轮播正常工作,但仍然无法正常工作。

这是我的轮播代码:

        <!-- Ad Carousel -->
    <div id="ad_carousel" class="carousel slide" data-ride="carousel">
        <!-- Indicators -->
        <ol class="carousel-indicators">
            <li data-target="#ad_carousel" data-slide-to="0" class="active"></li>
            <li data-target="#ad_carousel" data-slide-to="1"></li>
            <li data-target="#ad_carousel" data-slide-to="2"></li>
        </ol>

        <!-- Wrapper for slides -->
        <div class="carousel-inner">
            <div class="item active">
                <img src="images/ads/33.jpg">
            </div>
            <div class="item">
                <img src="images/ads/55.jpg">
            </div>
            <div class="item">
                <img src="images/ads/77.jpg">
            </div>
        </div>

        <!-- Controls -->
        <a class="left carousel-control" href="#ad_carousel" data-slide="prev">
            <span class="glyphicon glyphicon-chevron-left"></span>
        </a>
        <a class="right carousel-control" href="#ad_carousel" data-slide="next">
            <span class="glyphicon glyphicon-chevron-right"></span>
        </a>
    </div>

伴随着这些:

<link rel="stylesheet" href="plugins/bootstrap_3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="plugins/bootstrap_3.1.1/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="plugins/bootstrap_3.1.1/css/theme.css">
<script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="js/jquery-migrate-1.2.1.min.js"></script>
<script src="plugins/bootstrap_3.1.1/js/bootstrap.min.js"></script>

该插件以前可以正常工作,没有任何问题,但是直到今天,无论我做什么,都无需进行任何更改,它将无法在Google Chrome中运行。 我不知道这是不是Chrome更新造成了问题,但是我不确定会发生什么。

我已经在网上进行了调查,除上述问题外,没有发现任何类似的问题。

是什么让这个插件不起作用? 如何解决此问题,以使该插件再次在Chrome中运行?

编辑 :除此之外,我没有任何控制台错误。

EDIT2 :所以我将其缩减为我认为问题所在。 这是图片src链接。 我复制并粘贴伊舍伍德的传送带(在评论)的的jsfiddle代码到我的网页。 对于他的图像,他使用了一些猫图像的链接。 当我使用他的代码时,它可以正常工作,但是一旦我尝试使用服务器中的某些图像,它就不再起作用。 使用Chrome的网络开发工具,我查看了框架的资源。 轮播中的图像不被视为“图像”(或者至少不包含在images文件夹中)。 它们位于“其他”文件夹中。 它们仍然是.jpg文件,但是Chrome从资源和元素的角度将它们视为空白图片,宽度为0高度为0(0px x 0px)。 当我双击资源中的图像时,Chrome在另一个窗口中打开该图像,它显示得很好。

这完全让我感到困惑,我不知道发生了什么。 我尝试了许多不同的方法,但是似乎没有任何效果。 有什么建议么?

您可能应该禁用所有的Google Chrome浏览器扩展程序吗? 它们会导致错误,因为它们在每个html页面中添加了自己的javascript和样式。

您的控制台是否抛出任何错误?

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM