Bigcoomerce中的Flexslider用于产品滑块

时间:2014-03-15 03:03:34

标签: jquery jquery-plugins flexslider bigcommerce

我在bigcommerce中实现jquery flexslider http://www.myjqueryplugins.com/jquery-plugin/flexslider时遇到问题。我想将我的功能产品变成滑块。我已经将flexslider css和js上传到我的模板中。但它不起作用,功能产品将垂直显示但不以滑块方式显示。

这是我的代码:

<html>
<head>
<link rel="stylesheet" href="%%GLOBAL_ShopPath%%/template/FlexSlider/css/flexslider.css" type="text/css" media="screen" />
</head>

<body>

<div class="flexslider">
 <ul class="slides">
  %%Panel.HomeFeaturedProducts%%
 </ul>
</div>


  <!-- jQuery -->
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
  <script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.min.js">\x3C/script>')</script>

  <!-- FlexSlider -->
  <script defer src="%%GLOBAL_ShopPath%%/template/FlexSlider/js/jquery.flexslider.js"></script>

<script type="text/javascript" charset="utf-8">
  $(window).load(function() {

    //simple FlexSlider call
    $('.flexslider').flexslider();

    // more complex call
    $('.flexslider').flexslider({
         animation: "slide",
         controlsContainer: ".flex-container",
         start: function(slider) {
           $('.total-slides').text(slider.count);
         },
         after: function(slider) {
           $('.current-slide').text(slider.currentSlide);
         }
    });
  });
</script>

</body>
</html>

你有任何解决方案吗?

0 个答案:

没有答案