Question

在我的电脑中，箭头链接和carrousel在Firefox，Internet Explorer，Opera和Chrome中运行良好。但在网站上没有转盘，也没有箭头链接工作。我已经尝试了所有关于代码的内容。但无法找到原因，我甚至怀疑托管服务提供商。但我不这么认为。无论如何这里是代码：

<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<title>Ense&ntilde;ame a vivir en libertad centro de rehabilitacion</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Bootstrap -->
<link href='http://fonts.googleapis.com/css?family=Lato:300,400'        rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Abel' rel='stylesheet' type='text/css'>
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
<link href="css/moveme.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="js/html5shiv.js"></script>
<script src="js/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="container">
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="navbar-header">
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
    </button>
<img class="img-responsive" src='images/NewLogo_name_300px.png'  alt=''/>
</div> 
<div class="navbar-collapse collapse navbar-right">
    <ul class="nav navbar-nav">
        <li class="active"><a href="home.html">Inicio</a></li>
        <li><a href="#info">Info</a></li>
        <li><a href="#medico">Medico</a></li>
        <li><a href="#contact">Contacto</a></li>
        <li><a href="gallery.html">Testimonios</a></li>
        <li><a href="gallery_cert.html">Certificaciones</a></li>

    </ul>
</div>    
</nav>
</div>
<!-- End Navigation -->
<div id="myCarousel" class="carousel slide">
<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>
<div class="carousel-inner">
    <div class="item active">
        <img src="images/slide1.jpg">
        <div class="container active">
            <div class="carousel-caption">
                <h1>Recuperaci&oacute;n</h1>
                <p align="center">El primer paso es estar alejado de las fuentes que propician la adicci&oacute;n, para dar paso a la deshabituaci&oacute;n.</p>
                <p><a href="#contact" class="btn btn-primary btn-large">Contacto</a></p>
            </div>
        </div>
    </div>
    <div class="item">
        <img src="images/slide2.jpg">
        <div class="container active">
            <div class="carousel-caption">
                <h1>Servicio</h1>
                <p align="center">El segundo paso consiste en crear nuevos h&aacute;bitos, mejorando los propios juicios y actitudes en pro de una vida m&aacute;s sana.</p>
                <p><a href="#contact" class="btn btn-primary btn-large">Contacto</a></p>
            </div>
        </div>
    </div>
    <div class="item">
        <img src="images/slide3.jpg">
        <div class="container active">
            <div class="carousel-caption">
                <h1>Libertad</h1>
                <p align="center">El tercer paso consiste en adquirir las herramientas para vivir libre de adicciones a trav&eacute;s de la pr&aacute;ctica de principios espirituales y sociales que nos llevan a un sentido interno de libertad.</p>
                <p><a href="#contact" class="btn btn-primary btn-large">Contacto</a></p>
            </div>
        </div>
    </div>
</div>    
<a class="left carousel-control" href="#myCarousel" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
<a class="right carousel-control" href="#myCarousel" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span></a>
</div>    

<!--Carousel End -->
<div class="intro-block" id="info" >
<div class="container">
    <div class="row">
        <div class="col-xs-3">
            <img class="img-responsive tpad" src="images/logo2.png">
        </div>
        <div class="col-xs-9">
            <h1>LA MEJOR OPCION<span class="text-muted">&raquo; Desde el a&ntilde;o 2006</span></h1>
            <p class="lead justify">Somos el centro de rehabilitaci&oacute;n con mayor arraigo en Campeche, los que colaboramos como consultores y asesores en adicci&oacute;n sumamos m&aacute;s de 70 a&ntilde;os de experiencia trabajando en pro de la SOBRIEDAD y la vida en libertad sin el consumo de substancias.</p>
        </div>
    </div>
</div>    
</div>
<!-- End Intro Text -->


<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/jquery.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
<script>
$('.carousel').carousel({
    interval: 3000
})
</script>
</body>
</html>

我希望有人可以解释我为什么它在我的电脑上运行而不是在任何浏览器中如果我去网站，顺便说一下，它是www.vivirlibertad.com并且它是西班牙语。

提前致谢。

Answer 1

看起来网站上存在jQuery冲突。我检查了控制台，它说“$未定义”。

我在结束</body>标记之前看到您有以下代码：

<script>
    $('.carousel').carousel({
        interval: 3000
    })
</script>

这导致与其他JS文件冲突。将上述内容更改为：

<script>
    var $car = jQuery.noConflict();
    $car('.carousel').carousel({
        interval: 3000
    })
</script>

在此处查看有关jQuery冲突的官方文档：https://api.jquery.com/jquery.noconflict/

Bootstrap carrousel在我的计算机上工作正常，但在网站上却没有

1 个答案: