0

我正在尝试加载一个名为 flexslider 的滑块，但它不起作用，我无法弄清楚。

它与 magento local.xml 中的一行有关：

 <!-- Add js/css globally --> <reference name="head">

请问有什么帮助吗？ http://flexslider.woothemes.com/

控制台显示此错误“Uncaught TypeError: Cannot call method 'flexslider' of null”

具体部分是这个：

<div class="std"><script type="text/javascript">
$(window).load(function() {
$('.flexslider').flexslider({
 animation: "slide"
  });
});
</script>
<div class="flexslider">
<ul class="slides">
<li><img src="http://127.0.0.1/magento/skin/frontend/waterlee-boilerplate/default/images/kitchen1.jpg" alt="" /></li>
<li><img src="http://127.0.0.1/magento/skin/frontend/waterlee-boilerplate/default/images/kitchen2.jpg" alt="" /></li>
<li><img src="http://127.0.0.1/magento/skin/frontend/waterlee-boilerplate/default/images/kitchen3.jpg" alt="" /></li>
<li><img src="http://127.0.0.1/magento/skin/frontend/waterlee-boilerplate/default/images/kitchen4.jpg" alt="" /></li>
</ul>
</div></div>
4

1 回答 1

0

尝试将此代码放在<head>标签中而不是正文中。

<script type="text/javascript">
$(window).load(function() {
$('.flexslider').flexslider({
 animation: "slide"
  });
});
</script>

此外，在调用上述内容之前，请确保您有一个<script>加载 jQuery 的标签，并且您还有定义和加载的 flexslider 的 .js 文件，以及加载的 flexslider 的 .css 文件，最好在头部代码。

确保您已加载 jQuery... 该示例将其用于 jQuery，因此我建议您使用相同的：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

把它放在你的 head 标签中，在初始化 flexslider 的代码上方。

所以，在这两个标签之间<head>，</head>你应该有这样的东西：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="path to jquery.flexslider.js"></script>
<link rel="stylesheet" href="path to flexslider.css" type="text/css" media="screen" />
<script type="text/javascript">
    $(window).load(function() {
    $('.flexslider').flexslider({
     animation: "slide"
      });
    });
</script>
于 2013-08-12T04:34:41.773 回答