//客户合作 图片滚动
$('.imgs-scroll').newsScroll({ className: 'imgs-scroll', scrollElements: 'li', scrollDirection: 'left' });
$.fn.extend({
newsScroll: function (opt) {
if (!opt) opt = {};
opt = {
className: opt.className,//滚动外框的class值
scrollElements: opt.scrollElements,//滚动的标签
scrollSpeed: opt.scrollSpeed || 2000,//定义滚动间隙时间
scrollDirection: opt.scrollDirection || 'up'
}
var sumtemp = 0;
if (opt.scrollDirection == 'up' || opt.scrollDirection == 'down') {
$('.' + opt.className + ' ' + opt.scrollElements).each(function () {
sumtemp += $(this).height();
})
if ($('.' + opt.className).height() >= sumtemp) {
return false;
}
}
if (opt.scrollDirection == 'left' || opt.scrollDirection == 'right') {
$('.' + opt.className + ' ' + opt.scrollElements).each(function () {
sumtemp += $(this).width();
})
if ($('.' + opt.className).width() >= sumtemp) {
return false;
}
}
var _moving;//需要清除的动画
$('.' + opt.className).hover(function () {
clearInterval(_moving);//当鼠标在滚动区域中时,停止滚动
}, function () {
_moving = setInterval(function () {
var _field = $('.' + opt.className).find(opt.scrollElements + ':first');//此变量不可放置于函数起始处,li:first取值是变化的
var _h = _field.height();//取得每次滚动高度
var _w = _field.width();//取得每次滚动宽度
if (opt.scrollDirection == 'up') {
_field.animate({ marginTop: -_h + 'px' }, 'slow', function () {//通过取负margin值,隐藏第一行
_field.css('marginTop', 0).appendTo($('.' + opt.className));//隐藏后,将该行的margin值置零,并插入到最后,实现无缝滚动
})
} else if (opt.scrollDirection == 'down') {
_field.animate({ marginTop: _h + 'px' }, 'slow', function () {
_field.before($('.' + opt.className + ' ' + opt.scrollElements + ':last'));
$('.' + opt.className).find(opt.scrollElements).css({ marginTop: 0 });
})
} else if (opt.scrollDirection == 'left') {
_field.animate({ marginLeft: -_w + 'px' }, 'slow', function () {
_field.css('marginLeft', 0).appendTo($('.' + opt.className));
})
} else if (opt.scrollDirection == 'right') {
_field.animate({ marginLeft: _w + 'px' }, 'slow', function () {
_field.before($('.' + opt.className + ' ' + opt.scrollElements + ':last'));
$('.' + opt.className).find(opt.scrollElements).css({ marginLeft: 0 });
})
}
}, opt.scrollSpeed)//滚动间隔时间取决于opt.scrollSpeed
}).trigger('mouseleave');//函数载入时,模拟执行mouseleave,即自动滚动
}
})