Question

我（并且已经持续了几个小时）试图在我试图制作的这个页面上获得一个图像滑块。我被烧了。我真的需要帮助。以下是页面源代码。我猜混合是在那里而不是js或css。或者可能有太多参考样式表？或者事情的顺序？我从字面上复制并粘贴了一个教程网站的代码，但在我的生活中，我仍然无法弄清楚为什么它不会运行。我需要帮助。

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1.0">
  <title>OUTER LIMIT MEDIA SOLUTIONS</title>
  <link rel="stylesheet" href="bjqs.css">
    <link href='http://fonts.googleapis.com/css?family=Source+Code+Pro|Open+Sans:300' rel='stylesheet' type='text/css'> 
    <link rel="stylesheet" href="demo.css">
  <link rel="stylesheet" href="css/standardize.css">
  <link rel="stylesheet" href="css/index-grid.css">
  <link rel="stylesheet" href="css/index.css">


<!-- load jQuery and the plugin -->
    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
    <script src="js/bjqs-1.3.min.js"></script>



</head>
<body class="body index clearfix">
  <div class="container _container container-1 clearfix">
    <div class="element element-1"></div>
    <header class="_container clearfix">
      <img class="outer-limit-logo" src="imG/OUTER-LIMIT-LOGO-IMPROV.svg">
      <div class="contact">CONTACT</div>
      <div class="the-work">WORK</div>
      <div class="about">ABOUT      </div>
    </header>
  </div>

<div id="container">


      <!--  Outer wrapper for presentation only, this can be anything you like -->
      <div id="banner-slide">

        <!-- start Basic Jquery Slider -->
        <ul class="bjqs">
          <li><a href=""><img src="img/banner01.jpg" title="Automatically generated caption"></a></li>
          <li><img src="img/banner02.jpg" title="Automatically generated caption"></li>
          <li><img src="img/banner03.jpg" title="Automatically generated caption"></li>
        </ul>
        <!-- end Basic jQuery Slider -->

      </div>
      <!-- End outer wrapper -->

      <!-- attach the plug-in to the slider parent element and adjust the settings as required -->
      <script class="secret-source">
        jQuery(document).ready(function($) {

          $('#banner-slide').bjqs({
            animtype      : 'slide',
            height        : 320,
            width         : 620,
            responsive    : true,
            randomstart   : true
          });

        });
      </script>

    </div>






  <div class="divider"></div>
  <div class="container _container container-2 clearfix">
    <div class="element element-2"></div>
    <div class="element element-3"></div>
    <div class="element element-4"></div>
    <div class="element element-5"></div>
    <div class="element element-6"></div>
    <div class="element element-7"></div>
    <div class="element element-8"></div>
    <div class="element element-9"></div>
    <div class="element element-10"></div>
    <div class="element element-11"></div>
    <div class="element element-12"></div>
    <div class="element element-13"></div>
  </div>
  <footer class="_container _container-4 clearfix">
    <p class="text text-1">OUTER LIMIT MEDIA SOLUTIONS</p>
    <p onClick="window.location='mailto: info@outerlimitkw.com';" class="text text-2">INFO@OUTERLIMITKW.COM</p>
    <p class="text text-3">MAZAYA TOWER #1, 12TH FLOOR</p>
    <p class="text text-4">KHALID BIN AL WALEED ST.</p>
    <p class="text text-5">AL MURGAB, KUWAIT</p>
    <div class="container _container container-3 clearfix">
      <img class="facebook-outer-limit" src="imG/facebook-outer-limit.svg">
      <img class="instagram-outer-limit" src="imG/instagram-outer-limit.svg">
      <img class="linkedin-outer-limit" src="imG/linkedin-outer-limit.svg">
      <img class="twitter-outer-limit" src="imG/twitter-outer-limit.svg">
      <img class="google-plus-outer-limit" src="imG/google-plus-outer-limitt.svg">
    </div>
  </footer>
</body>
</html>

Answer 1

你跟随的tuto是什么？只是检查它并将其与你的工作进行比较。一点建议，尝试下订单并保留它。所有图像都放在某个目录中（例如“/ images”），与样式表相同（例如“/ css”），以及所有其他内容。

如果确定所有内容都在正确的位置，请检查您对HTML所做的每一个引用，尝试将每个CSS放在较少的文件中，如果不是绝对必须将它分开。

当你完成后，我建议你逐步检查，以达到更低的目标，找到/调试所有这些都出错的地方。

我有一个猜测，检查demo.css是否应该在哪里。然后到脚本，我相信该元素没有类属性（http://www.w3schools.com/tags/tag_script.asp类属性显然不存在该标记），尝试删除它并用type =“text / javascript”替换它并移动它到文件的底部......

希望这有帮助！

PS：REMAINDER !,如果您在同一级别中将某个文件夹中的内容引用到另一个文件夹，只需确保在斜杠（../）之前添加点，因为您需要访问父级别才能访问其他文件夹夹。如果您有多个级别的文件夹只需重复点数并且需要多次删减，这同样适用，但是老兄，不要滥用它。随着水平越低越好，始终保持简单和调制。

我的jQuery图像滑块有轻微问题

1 个答案: