个人中心
gpt4 book ai didi

javascript - Bootstrap 3 轮播无法正确加载/显示

转载 作者：行者123 更新时间：2023-11-28 06:49:13 25 4
gpt4 key购买 nike

我正在使用 html5boilerplate 和 Twitter Bootstrap 转换一些 psd 文件。现在我的问题很简单。

我想将容器分成两半，这样我就可以在一侧加载一个旋转木马，在另一侧加载一些文本，我知道如何划分它，但是当我加载旋转木马时，我只得到了这个 simply it is not loading like it should be. .现在我知道并且我在 SO 上看到它是关于 jQuery 没有正确加载，但一切都在加载我只是可以看到错误在哪里。

有人可以检查我的 index.html，并向我解释这张图片有什么问题吗？谢谢。

<!doctype html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8" lang=""> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9" lang=""> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang=""> <!--<![endif]-->
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="apple-touch-icon" href="apple-touch-icon.png">

        <link rel="stylesheet" href="css/bootstrap.min.css">
        <link rel="stylesheet" href="css/fotn-awesome.min.css">
        <style>
            body {
                padding-top: 50px;
                padding-bottom: 20px;
            }
        </style>
        <link rel="stylesheet" href="css/bootstrap-theme.min.css">
        <link rel="stylesheet" href="css/main.css">

        <script src="js/vendor/modernizr-2.8.3-respond-1.4.2.min.js"></script>
    </head>
    <body>
        <!--[if lt IE 8]>
            <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
        <![endif]-->
    <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#"><img src="#" height=30 width=41></a>
        </div>
        <div class="navbar-collapse collapse">
            <ul id="navbar" class="nav navbar-nav navbar-right">
                <li><a href="#">Home</a></li>
                <li><a href="#">Apartments</a></li>
                <li><a href="#">About</a></li>
                <li style="padding-top: 8px;"><button type="button" class="btn btn-sm btn-info round">GET STARTED</button></li>
            </ul>
        </div><!--/.navbar-collapse -->
      </div>
    </nav>

    <!-- Main jumbotron for a primary marketing message or call to action -->
    <div class="jumbotron">
      <div class="container text-center">
        <h1>Hello, NYC!</h1>
        <p>Place to put NYC Bay picture!</p>
      </div>
    </div>

    <div class="container">
        <!-- JOIN SOCIETE section -->
        <div class="row">
           <div class="col-xs-12 text-center">
               &nbsp;
               &nbsp;
               <h2><span class="glyphicon glyphicon-stop"></span>&nbsp;JOIN SOCIETE</h2>
              <p>Literati Group Hosing LLC provides furnished housing for the</p>
                  <p>New York City international community of students, interns,</p>
                  <p>and young professionals.</p>
           </div> 
        </div>
    </div>

    <div class="container">
       <div class="row">
           <!-- container devider -->
          <p style="padding: 30px;"></p> 
       </div> 
    </div>

    <div class="container">
      <!-- SOCIETE row of columns -->
      <div class="row">
        <div class="col-xs-12 col-sm-3 col-sm-offset-2">
            <h4><strong>No Broker or Hidden Fees</strong></h4>
          <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
        </div>
        <div class="col-sm-3">
            <h4><strong>Extremely Fast.</strong></h4>
          <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
       </div>
        <div class="col-sm-3">
            <h4><strong>Flexible Lease Terms</strong></h4>
          <p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
        </div>
      </div>

      <hr>

      <div class="row">
        <div class=" col-xs-12 col-sm-3 col-sm-offset-2">
            <h4><strong>Operations and Engeneering.</strong></h4>
          <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
        </div>
        <div class="col-sm-3">
            <h4><strong>Networking.</strong></h4>
          <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
       </div>
        <div class="col-sm-3">
            <h4><strong>Safety.</strong></h4>
          <p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
        </div>
      </div>

    <div class="container">
       <div class="row">
           <!-- container devider -->
          <p style="padding: 30px;"></p> 
       </div> 
    </div>

    <div class="container">
       <div class="row">
           <!--Carousel Best Appartments Section--> 
              <div id="carousel-example-generic" class="carousel slide col-sm-6" data-ride="carousel">
                <!-- Indicators -->
                <ol class="carousel-indicators">
                  <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                  <li data-target="#carousel-example-generic" data-slide-to="1"></li>
                  <li data-target="#carousel-example-generic" data-slide-to="2"></li>
                </ol>

                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                  <div class="item active">
                    <img src="..." alt="...">
                    <div class="carousel-caption">
                      ...
                    </div>
                  </div>
                  <div class="item">
                    <img src="..." alt="...">
                    <div class="carousel-caption">
                      ...
                    </div>
                  </div>
                  ...
                </div>

                <!-- Controls -->
                <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
                  <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                  <span class="sr-only">Previous</span>
                </a>
                <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
                  <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                  <span class="sr-only">Next</span>
                </a>
              </div>
       </div><!-- end row --> 
    </div><!-- end carousel container -->
<hr />
      <footer>
        <p>&copy; Company 2015</p>
      </footer>
    </div> <!-- /container -->        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
        <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.11.2.min.js"><\/script>')</script>

        <script src="js/vendor/bootstrap.min.js"></script>

        <script src="js/main.js"></script>

        <!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
        <script>
            (function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
            function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
            e=o.createElement(i);r=o.getElementsByTagName(i)[0];
            e.src='//www.google-analytics.com/analytics.js';
            r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
            ga('create','UA-XXXXX-X','auto');ga('send','pageview');
        </script>
    </body>
</html>

最佳答案

尝试在您的脚本标记上将 http 添加到 jquery。

关于javascript - Bootstrap 3 轮播无法正确加载/显示，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33881944/

25 4 0
文章推荐： javascript - 无法在 javascript 脚本标记内输出实际的 json 数据
文章推荐： ios - Xcode 将图像保存为特定形状
文章推荐： c++ - 保存和恢复内存位置列表的清洁机制？
文章推荐： ios - Swift:如果删除了 child 的观察者，则不会调用 Firebase 身份验证观察者
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com