JavaScript 滑移效果
上一篇 / 下一篇 2008-05-16 19:54:18 / 个人分类：转载
效果
自动滑移:
其他效果new Slippage("idSlippage3", { X: [200,200,0,-200,-100,-100], Y: [0,0,100,-100,100,-100], Loop: true });
代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>滑移效果</title>
<script type="text/javascript">
var $ = function (id) {
return "string" == typeof id ? document.getElementById(id) : id;
};
function Event(e){
var oEvent = document.all ? window.event : e;
if (document.all) {
oEvent.pageX = oEvent.clientX + document.documentElement.scrollLeft;
oEvent.pageY = oEvent.clientY + document.documentElement.scrollTop;
}
return oEvent;
}
function addEventHandler(oTarget, sEventType, fnHandler) {
if (oTarget.addEventListener) {
oTarget.addEventListener(sEventType, fnHandler, false);
} else if (oTarget.attachEvent) {
oTarget.attachEvent("on" + sEventType, fnHandler);
} else {
oTarget["on" + sEventType] = fnHandler;
}
};
function removeEventHandler(oTarget, sEventType, fnHandler) {
if (oTarget.removeEventListener) {
oTarget.removeEventListener(sEventType, fnHandler, false);
} else if (oTarget.detachEvent) {
oTarget.detachEvent("on" + sEventType, fnHandler);
} else {
oTarget["on" + sEventType] = null;
}
};
var Class = {
create: function() {
return function() {
this.initialize.apply(this, arguments);
}
}
}
Object.extend = function(destination, source) {
for (var property in source) {
destination[property] = source[property];
}
return destination;
}
var Slippage = Class.create();
Slippage.prototype = {
initialize: function(obj, options) {
this.obj = $(obj);
this._timer =null;
this._xs = this._ys = [];
this.X = parseInt(this.obj.style.left) || 0;
this.Y = parseInt(this.obj.style.top) || 0;
this.SetOptions(options);
this.Step = Math.abs(this.options.Step);
this.Time = Math.abs(this.options.Time);
this.Loop = this.options.Loop;
this.Relative = this.options.Relative;
this.SetPosition(this.options.X || [], this.options.Y || []);
},
//设置默认属性
SetOptions: function(options) {
this.options = {//默认值
Step: 10,//滑动变化率
Time: 10,//滑动延时
X: [],//x坐标变化
Y: [],//y坐标变化
Loop: false,//是否循环
Relative: true//是否相对位置
};
Object.extend(this.options, options || {});
},
//
SetPosition: function(arrX, arrY) {
if(arrX.length <= 0 && arrX.length
自动滑移:
其他效果
代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>滑移效果</title><script type="text/javascript">
var $ = function (id) {
return "string" == typeof id ? document.getElementById(id) : id;};function Event(e){ var oEvent = document.all ? window.event : e; if (document.all) { oEvent.pageX = oEvent.clientX + document.documentElement.scrollLeft; oEvent.pageY = oEvent.clientY + document.documentElement.scrollTop; } return oEvent;}function addEventHandler(oTarget, sEventType, fnHandler) { if (oTarget.addEventListener) { oTarget.addEventListener(sEventType, fnHandler, false); } else if (oTarget.attachEvent) { oTarget.attachEvent("on" + sEventType, fnHandler); } else { oTarget["on" + sEventType] = fnHandler; }};function removeEventHandler(oTarget, sEventType, fnHandler) { if (oTarget.removeEventListener) { oTarget.removeEventListener(sEventType, fnHandler, false); } else if (oTarget.detachEvent) { oTarget.detachEvent("on" + sEventType, fnHandler); } else { oTarget["on" + sEventType] = null; }};var Class = { create: function() { return function() { this.initialize.apply(this, arguments); } }}Object.extend = function(destination, source) { for (var property in source) { destination[property] = source[property]; } return destination;}var Slippage = Class.create();Slippage.prototype = { initialize: function(obj, options) { this.obj = $(obj); this._timer =null; this._xs = this._ys = []; this.X = parseInt(this.obj.style.left) || 0; this.Y = parseInt(this.obj.style.top) || 0; this.SetOptions(options); this.Step = Math.abs(this.options.Step); this.Time = Math.abs(this.options.Time); this.Loop = this.options.Loop; this.Relative = this.options.Relative; this.SetPosition(this.options.X || [], this.options.Y || []); }, //设置默认属性 SetOptions: function(options) { this.options = {//默认值 Step: 10,//滑动变化率 Time: 10,//滑动延时 X: [],//x坐标变化 Y: [],//y坐标变化 Loop: false,//是否循环 Relative: true//是否相对位置 }; Object.extend(this.options, options || {}); }, // SetPosition: function(arrX, arrY) { if(arrX.length <= 0 && arrX.length
导入论坛 引用链接 收藏 分享给好友 推荐到圈子 管理 举报
TAG:
