/** * parallelroll 左右无缝滚动 * boxname : 最外层盒子类名 * tagname : 滚动标签元素 * time : 滚动间隔时间 * direction : 滚动方向 right-->向右 left-->向左 * visual : 可视数 * prev : 上一张 * next : 下一张 * author : mr chen 261619000@qq.com * date: 15-03-19 * */ (function($){ $.fn.parallelroll = function(options){ var opts = $.extend({}, $.fn.parallelroll.defaults, options); var _this = this; var l = _this.find(opts.tagname).length; var autorolltimer; var flag = true; // 防止用户快速多次点击上下按钮 var arr = new array(); /** * 如果当 (可视个数+滚动个数 >滚动元素个数) 时 为不出现空白停顿 将滚动元素再赋值一次 * 同时赋值以后的滚动元素个数是之前的两倍 2 * l. * */ if(opts.amount + opts.visual > l){ _this[0].innerhtml += _this[0].innerhtml; l = 2 * l; }else{ l = l; } var w = _this.find(opts.tagname).outerwidth(true); //计算元素的宽度 包括补白+边框 _this.css({width: (l * w) + 'px'}); // 设置滚动层盒子的宽度 return this.each(function(){ _this.closest('.'+opts.boxname).hover(function(){ clearinterval(autorolltimer); },function(){ switch (opts.direction){ case 'left': if(opts.time>0){ autorolltimer = setinterval(function(){ left(); },opts.time); } break; case 'right': if(opts.time>0){ autorolltimer = setinterval(function(){ right(); },opts.time); } break; default : alert('参数错误!'); break; } }).trigger('mouseleave'); $('.'+opts.boxname+' .'+opts.prev).on('click',function(){ flag ? left() : ""; }); $('.'+opts.boxname+' .'+opts.next).on('click',function(){ flag ? right() : ""; }); }); function left(){ flag = false; _this.animate({marginleft : -(w*opts.amount)},1000,function(){ _this.find(opts.tagname).slice(0,opts.amount).appendto(_this); _this.css({marginleft:0}); flag = true; }); }; function right(){ flag = false; arr = _this.find(opts.tagname).slice(-opts.amount); for(var i = 0; i