var eventUtil = {
//添加句柄
addHandler : function(element, type, handler){
if (element.addEventListener) {
element.addEventListener(type, handler, false)
} else if (element.attachEvent) {
element.attachEvent('on'+type, handler);
} else{
element['on'+type] = handler;
}
},
//删除句柄
removeHandler : function(element, type, handler){
if (element.removeEventListener) {
element.removeEventListener(type, handler, false)
} else if (element.detachEvent) {
element.detachEvent('on'+type, handler);
} else{
element['on'+type] = null;
}
},
//获取event
getEvent : function(event){
return event?event:window.event;
},
//获取事件类型
getType : function(event){
return event.type;
}
//获取事件目标
getElement : function(){
return event.target || event.srcElement;
}
//阻止默认行为
preventDefault : function(event){
if (event.preventDefault) {
event.preventDefault();
} else {
event.returnValue = false;
}
},
//阻止事件冒泡
stopPropagation : function(event){
if (event.stopPropagation) {
event.stopPropagation();
} else {
event.cancelBubble = true;
}
}
}
//获取class
function getByClass(clsName,parent){
var oParent = parent?document.getElementById(parent):document,
eles = [],
elements = oParent.getElementsByTagName('*');
for (var i = 0, l = elements.length; i < l; i++) {
if (elements[i].className == clsName) {
eles.push(elements[i]);
}
}
return eles;
}
window.onload = drag;
拖拽
function Drag(id){
var _this = this;
this.disX = 0;
this.disY = 0;
this.oDiv = document.getElementById(id);
this.oDiv.onmousedown = function (ev){
_this.fnDown(ev);
return false;
}
}
Drag.prototype.fnDown = function(ev){
var _this = this;
var oEvent = ev||event;
this.disX = oEvent.clientX - this.oDiv.offsetLeft;
this.disY = oEvent.clientY - this.oDiv.offsetTop;
document.onmousemove = function (ev){
_this.fnMove(ev);
};
document.onmouseup = function (){
_this.fnUp();
};
}
Drag.prototype.fnMove = function(ev){
var _this = this;
var oEvent = ev||event;
this.oDiv.style.left = oEvent.clientX - this.disX + 'px';
this.oDiv.style.top = oEvent.clientY - this.disY + 'px';
}
Drag.prototype.fnUp = function(){
document.onmousemove = null;
document.onmouseup = null;
}
拖拽时不跑出窗口
function LimitDrag(id){
Drag.call(this, id);
}
for (var i in Drag.prototype) {
LimitDrag.prototype[i] = Drag.prototype[i];
};
LimitDrag.prototype.fnMove = function (ev){
var oEvent = ev||event;
var l = oEvent.clientX - this.disX;
var t = oEvent.clientY - this.disY
if (l < 0) {
l = 0;
} else if (l > document.documentElement.clientWidth - this.oDiv.offsetWidth) {
l = document.documentElement.clientWidth - this.oDiv.offsetWidth;
}
this.oDiv.style.left = l + 'px';
this.oDiv.style.top = t + 'px';
}
运动
function getStyle (obj, name){
if (obj.currentStyle) {
return obj.currentStyle[name];
} else {
return getComputedStyle(obj, false)[name];
}
}
function startMove(obj, json, fnEnd){
clearInterval(obj.timer);
obj.timer = setInterval(function (){
var bStop = true;
for (var attr in json) {
var cur = 0;
if (attr == 'opacity') {
cur = Math.round(parseFloat(getStyle(obj,attr)*100));
} else {
cur = parseInt(getStyle(obj,attr))
}
var speed = (json[attr] - cur)/6;
speed = speed>0?Math.ceil(speed):Math.floor(speed);
if (cur != json[attr]) {
bStop = false;
}
if (attr == 'opacity') {
obj.style.filter = 'alpha(opacity:'+(cur + speed)+')';
obj.style.opacity = (cur + speed)/100;
} else {
obj.style[attr] = cur + speed + 'px';
}
if (bStop) {
clearInterval(obj.timer);
if (fnEnd)
fnEnd();
};
};
}, 30);
}