jcarousel无效

时间:2016-10-13 10:52:00

标签: javascript jcarousel

我第一次在我的网站上使用jcarousel并尝试一次查看轮播6images中的图像

controls无效prevnext

这是我试过的代码......

在标题中我已包含这些文件

<link rel="stylesheet" type="text/css" href=".../css/jcarousel.responsive.css">
<link rel="stylesheet" type="text/css" href=".../css/jcarousel.responsive.css">

<script type="text/javascript" src=".../js/jquery.jcarousel.min.js"></script>
<script type="text/javascript" src=".../js/jcarousel.responsive.js"></script>

这是身体

<div class="col-lg-12 cont-carousel">
      <div class="jcarousel-wrapper">
              <div class="jcarousel" data-jcarousel="true">
                  <ul>
                    <li ng-repeat="profile in ProfileData"><div class="thumb"><img src="{{profile.Image}}" alt=""></div><a href=".../{{profile.id}}"></a></li>
                  </ul>
              </div>
              <a href="" class="jcarousel-control-prev" data-jcarouselcontrol="true">‹</a>
              <a href="" class="jcarousel-control-next" data-jcarouselcontrol="true">›</a>
              <p class="jcarousel-pagination"></p>
          </div>
    </div>

这是js脚本jcarousel.responsive.js

(function($) {
    $(function() {
        var jcarousel = $('.jcarousel');

        jcarousel
             .on('jcarousel:reload jcarousel:create', function () {
                 var carousel = $(this),
                     width = carousel.innerWidth();

                 if (width >= 600) {
                     width = width / 3;
                 } else if (width >= 350) {
                     width = width / 2;
                 }

                 carousel.jcarousel('items').css('width', Math.ceil(width) + 'px');
             })
            .jcarousel({
                wrap: 'circular'
            });

        $('.jcarousel-control-prev')
            .jcarouselControl({
                target: '-=1'
            });

        $('.jcarousel-control-next')
            .jcarouselControl({
                target: '+=1'
            });

         $('.jcarousel-pagination')
             .on('jcarouselpagination:active', 'a', function() {
                 $(this).addClass('active');
             })
             .on('jcarouselpagination:inactive', 'a', function() {
                 $(this).removeClass('active');
             })
             .on('click', function(e) {
                 e.preventDefault();
             })
             .jcarouselPagination({
                 perPage: 1,
                 item: function(page) {
                     return '<a href="#' + page + '">' + page + '</a>';
                 }
             });
    });
})(jQuery);

点击箭头时没有发生任何事情 有人可以帮助我...

0 个答案:

没有答案