Javascript 为什么JQuery循环插件在这个应用程序中被破坏了？_Javascript_Jquery_Plugins

Javascript 为什么JQuery循环插件在这个应用程序中被破坏了？

javascript jquery plugins

Javascript 为什么JQuery循环插件在这个应用程序中被破坏了？,javascript,jquery,plugins,Javascript,Jquery,Plugins,我第一次使用JQuery，并尝试制作一个简单的图像幻灯片。在大多数情况下，我都是这样做的。我最终得到了以下代码： <head> <style> @import "main.css"; </style> <script type="text/javascript" src="jquery-3.0.0.min.js"> </script> <script type="text/javascript" src="jquery.c

我第一次使用JQuery，并尝试制作一个简单的图像幻灯片。在大多数情况下，我都是这样做的。我最终得到了以下代码：

<head>
<style> @import "main.css"; </style>
  <script type="text/javascript" src="jquery-3.0.0.min.js"> </script>
  <script type="text/javascript" src="jquery.cycle.all.js"> </script>
  <script type="text/javascript">
    $('#slider').cycle({
    fx:     'scrollHorz',
    speed:  'slow',
    next:   '#next',
    prev:   '#prev'
    });
 </script>
</head>
<body>

<div id="picwrap">
<div id="piccont">

  <div id="prev" class="controller"> </div>
  <div id="slider">
    <img src="pic1.png" />
    <img src="pic2.png" />
    <img src="pic3.png" />
  </div>
  <div id="next" class="controller"> </div>

</div>
</div>

</body>

这个脚本似乎根本不起作用。我只能假设我犯了一个很难注意到的小错误。我多次与视频交叉引用，并检查了路径和文件名。我也看过在其他教程中，我找不到我做错了什么。插件的实现似乎完全失败了，因为在添加脚本之前和之后，文件中似乎没有什么不同。我得到一个静态图像（图1），上面有两个箭头（不可勾选）

任何帮助都将不胜感激。

您的CSS似乎不正确。第一行写着‘picWrap’，但如果我没记错的话，应该是‘picWrap’。大多数时候，当Cycle没有产生错误但仍然不起作用时，它在CSS中

此外，将JS放在底部（在关闭body标记之前），并将JS更改为：

$(document).ready(function(){
    $('#slider').cycle({
        fx:     'scrollHorz',
        speed:  'slow',
        next:   '#next',
        prev:   '#prev'
    });
});

Cycle需要先加载图像，然后才能计算不同幻灯片的大小。有时我甚至选择使用$（window.load）而不是$（document.ready）。窗口加载在图像完全加载后执行。

您的CSS似乎不正确。第一行写着‘picWrap’，但如果我没记错的话，应该是‘picWrap’。大多数时候，当Cycle没有产生错误但仍然不起作用时，它在CSS中

此外，将JS放在底部（在关闭body标记之前），并将JS更改为：

$(document).ready(function(){
    $('#slider').cycle({
        fx:     'scrollHorz',
        speed:  'slow',
        next:   '#next',
        prev:   '#prev'
    });
});

Cycle需要先加载图像，然后才能计算不同幻灯片的大小。有时我甚至选择使用$（window.load）而不是$（document.ready）。窗口加载在图像完全加载后执行。

非常感谢，将Javascript更改为您的版本解决了问题。至于CSS，老实说，我只是一个业余爱好者，不知道它有一个无处不在的案例惯例，我只是把它放在小写字母里。缺少的散列只是一个格式错误，我已经在代码中包含了它。非常感谢，将Javascript更改为您的版本解决了这个问题。至于CSS，老实说，我只是一个业余爱好者，不知道它有一个无处不在的案例惯例，我只是把它放在小写字母里。缺少的散列只是一个格式错误，我已经在代码中包含了它。