文章/答案/技术大牛

发布

社区首页 >问答首页 >我的jQuery图像滑块有一点小问题

问我的jQuery图像滑块有一点小问题
EN

Stack Overflow用户

提问于 2014-08-19 09:19:11

回答 1查看 54关注 0票数 0

我正在(并且已经有几个小时)试图在我试图制作的这个页面上获得一个图像滑块。我筋疲力尽了。我真的需要帮助。下面是页面源代码。我猜混搭就在里面，而不是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>

jquery

html

css

回答 1

Stack Overflow用户

发布于 2014-08-19 09:51:47

你遵循的教程是什么？，只是为了检查一下，并与你的作品进行比较。一个小小的建议，试着下订单并遵守它。所有的图像都将其放入某个目录中(例如，"/images")，样式表也是如此(例如，"/css")，以及所有其他东西。

当你确定所有内容都放在正确的位置时，检查你在HTML上所做的每个引用，如果不是绝对必要的话，试着把每个CSS放在更少的文件中。

当您完成后，我建议您一步一步地检查，以实现较低的目标，以查找/调试所有这些错误的地方。

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

希望这能有所帮助！

PS: REMAINDER!，如果您在同一级别中从一个文件夹引用到另一个文件夹，只需确保在斜杠(../)前添加点，因为您需要访问父级才能访问另一个文件夹。如果你有多个级别的文件夹，这同样适用，只要重复点和斜杠你需要的次数，但是伙计，不要滥用它。因为级别越少越好，请始终保持简单和调节。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/25374340

复制

相似问题

问我的jQuery图像滑块有一点小问题
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问我的jQuery图像滑块有一点小问题EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问我的jQuery图像滑块有一点小问题
EN