首页 > 图片轮播问题

图片轮播问题


一个图片轮播效果点击左右按钮已经可以切换,但是我想当它到最左的li时候无法再向右右滑动,
当他到最右的li时候无法再向左滑动。就是不要循环效果,第一张到最后一张 按钮无法点击,不在点击循环到第一张,怎么判断呢

var prev = wraper.find('.prev');

      var next = wraper.find('.next');
      var img = wraper.find('.img-list').find('ul');
      var w = img.find("li").outerWidth(true);
      var s = config.speed;
      
      prev.click(function(){
              
            img.animate({'margin-left':-w},function()
                      {
                       img.find('li').eq(0).appendTo(img)
                       img.css({'margin-left':0});
                       });
            });
      next.click(function(){    
            img.find('li:last').prependTo(img);
            img.css({'margin-left':-w});
            img.stop(true).animate({'margin-left':0});
            });

简单就先执行边界判断,判断你自己设定的margin-left的值是否到了左右两个边界值


如果不想浪费时间,可以看看slick.js目前最好的轮播插件之一。屡试不爽。http://kenwheeler.github.io/slick/

【热门文章】
【热门文章】