鼠标滚轮及左右键切换图片

最新推荐文章于 2024-10-12 10:48:21 发布

转载最新推荐文章于 2024-10-12 10:48:21 发布 · 221 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/lbsgood/archive/2012/06/08/2541811.html

文章标签：

#c/c++

一个图片滚动的效果，可以鼠标滚轮控制，键盘左右键控制,是否显示说明文字，是否自动播放……


var MouseSlide=function(option){
	if(typeof(arguments[0]) == 'undefined'){ return false; }
	var option = typeof(arguments[0]) == 'object' ? arguments[0] : {};
	
	this.setoptions(option);
	this.data = this.option.data;
	if(this.data.length == 0){ return; }
	this.total = this.data.length;
	this.parent = this.option.parent;
	this.bAuto = this.option.bAuto;
	this.bAuto && ( this.delay = this.option.delay );
	this.bKey = this.option.bKey;
	this.bMouse = this.option.bMouse;
	this.bTitle = this.option.bTitle;
	
	this.items = [];
	this.thumbs = [];
	this.index = 0;
	this.timer = null;
	this.paused = false;
	this.init();
}
MouseSlide.prototype = {
	//读取数据
	readdata: function(){
		//...
	},
	//设置默认参数
	setoptions: function(option){
		this.option = {
			data:		[],//读取的数据
			parent:		document.body,//插入的父节点
			bTitle:		false,//是否显示文字说明（默认否）
			bAuto:		false,//是否自动播放（默认否）
			bKey:		false,//是否键盘控制（默认否）
			bMouse:		false,//是否鼠标滚轮控制（默认否）
			delay:		5000,//自动播放间隔时间（自动播放时有效）
			onStart:	function(){},//滚动开始时执行
			onComplete:	function(){}//滚动结束时执行
		};
		Extend(this.option, option || {});
	},
	//初始化
	init: function(){
		//...
	},
	//初始设置
	initset: function(){
		//...
	},
	//滚动核心
	scroll: function(){
		var _this = this;
		_this.onStart && _this.onStart();
		for(var i=0;i<_this.total _this.thumbs animate _this.oncomplete onevent: function var _this="this;" for i="0;" _this.timer _this.stop _this.index="this.index;" _this.scroll mousewheel: scrollevent e="e" window.event down="false;" if true : false _this.index-- _this.total _this.total-1 e.preventdefault e.returnvalue="false;" e.stoppropagation e.cancelbubble="true;" return _this.dom.addeventlistener _this.dom.onmousewheel="scrollEvent;" keyup: document.onkeyup="function(e){" e.keycode="=37" _this.bauto bind: this.onevent this.bkey this.keyup this.bmouse this.mousewheel this.bauto this.play this.dom.onmouseover="function(){" this.dom.onmouseout="function(){" _this.play play: _this.paused="false;}" this.timer="setInterval(function(){">= _this.total - 1 && (_this.index = 0);
			!_this.paused && _this.scroll();
		}, this.delay);		
	},
	//播放停止
	stop: function(){
		clearInterval(this.timer);
		this.timer = null;
	}
}

鼠标滚轮及左右键切换图片

转载于:https://www.cnblogs.com/lbsgood/archive/2012/06/08/2541811.html