/**
* ApexSlider - 图片纵向滚动插件
* @requires jQuery v1.2 or above
* @author kingapex
* http://www.enation.cn
* Copyright (c) 2010 enaiton
* Version: 1.0
*/
/**
* 使用说明:
* $(".list").ApexSlider();
* 给定一个容器,会循环滑动这个容器的子,
* 不限定容器及其子的html元素类型,
* 容器和子的高度差不要太大,否则效果不太好。
*
* 选项:
* speed:滑动速度,默认500
* step:停顿时长,默认4000
*/
(function($) {
$.fn.ApexSlider = function(o) {
var timer =undefined;
o = $.extend({
speed: 500,
step:4000
}, o || {});
return this.each(function() {
var box = $(this);
var children= $(this).children();
var height =parseInt( box.css("height").replace("px"));
children.each(function(i){
$(this).css("top",i*height +"px");
}).hover(function(){
stop();
},
function(){
start();
}
);
function start(){
timer = setInterval(function() {
go();
},o.step);
}
function stop(){
if(timer){
clearInterval(timer);
}
}
start();
function go(){
children.animate({top:"-="+height},o.speed,'swing',function(){
restore();
});
}
function restore(){
var top=0;
var topEl=undefined;
children.each(function(i){
var temp = parseInt($(this).css("top").replace("px") );
if(temp<top){
topEl =$(this);
top=temp;
}
});
if(topEl)
topEl.css('top',(children.size()-1)*height+'px');
}
});
};
})(jQuery);
发布一个jquery插件-图片纵向(向上)循环滚动
最新推荐文章于 2022-02-23 15:54:45 发布
108

被折叠的 条评论
为什么被折叠?



