JavaScript 图片切割效果

cloudgamer 2008-08-06 02:13:48

加精

var $ = function (id) {

    return "string" == typeof id ? document.getElementById(id) : id;

};



var isIE = (document.all) ? true : false;



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;

}

...全文

11379 252 打赏收藏转发到动态举报

写回复

用AI写文章

252 条回复

切换为时间正序

请发表友善的回复…

发表回复

GoSky 2012-06-05

打赏
举报

感谢分享！

anyanlongA 2012-06-04

打赏
举报

挺好的，学习

zhufangya 2012-05-20

打赏
举报

厉害收藏了

i2ibm 2012-03-30

打赏
举报

喜欢，支持一个。

wangzhanxuan 2012-03-20

打赏
举报

新手过来学习

anymorec 2012-03-03

打赏
举报

标记一下

happytonice 2012-02-11

打赏
举报

收藏！

很多好东西=好东西+好东西；

lqx302 2012-02-02

打赏
举报

果断，强悍Q!

zhaoting736488387 2012-01-09

打赏
举报

请问如果把图片地址换成图片的id怎样写

accp1116 2011-11-15

打赏
举报

还没学到那个，看不懂先留个记号

bbaa007 2011-11-15

打赏
举报

顶。楼主很强啊，呵呵

蝜蝂 2011-11-02

打赏
举报

mark 不错。

飘冥 2011-11-02

打赏
举报

楼主我顶礼膜拜~！

似乎不用我来告诉你 2011-10-13

打赏
举报

好帖
顶

hongfeng01 2011-10-10

打赏
举报

学习了

gm861109 2011-06-08

打赏
举报

非常好啊。

kmokd 2011-06-05

打赏
举报

很好的学习资料。谢谢。

henrycomein 2011-04-19

打赏
举报

代码很多，表示无心看完

z532264001 2011-04-08

打赏
举报

高手，我都看不懂

m1278528280 2011-04-06

打赏
举报

//缩放
Resize: function(e) {
//没有触发对象的话返回
if(!this._touch) return;
//清除选择(ie设置捕获后默认带这个)
window.getSelection && window.getSelection().removeAllRanges();
//执行缩放程序
this._fun(window.event || e);
//设置样式
//因为计算用的offset是把边框算进去的所以要减去
this._obj.style.width = this.style_width - this._xBorder + "px";
this._obj.style.height = this.style_height - this._yBorder + "px";
this._obj.style.top = this.style_top + "px";
this._obj.style.left = this.style_left + "px";
//附加程序
this.onResize();
},
//普通缩放
//右边
SetRight: function(oEvent) {
//当前坐标位置减去左边的坐标等于当前宽度
this.repairRight(oEvent.clientX - this._left);
},
//下边
SetDown: function(oEvent) {
this.repairDown(oEvent.clientY - this._up);
},
//左边
SetLeft: function(oEvent) {
//右边的坐标减去当前坐标位置等于当前宽度
this.repairLeft(this._right - oEvent.clientX);
},
//上边
SetUp: function(oEvent) {
this.repairUp(this._down - oEvent.clientY);
},
//比例缩放
//比例缩放右下
scaleRightDown: function(oEvent) {
//先计算宽度然后按比例计算高度最后根据确定的高度计算宽度（宽度优先）
this.SetRight(oEvent);
this.repairDown(parseInt(this.style_width / this._scale));
this.repairRight(parseInt(this.style_height * this._scale));
},
//比例缩放左下
scaleLeftDown: function(oEvent) {
this.SetLeft(oEvent);
this.repairDown(parseInt(this.style_width / this._scale));
this.repairLeft(parseInt(this.style_height * this._scale));
},
//比例缩放右上
scaleRightUp: function(oEvent) {
this.SetRight(oEvent);
this.repairUp(parseInt(this.style_width / this._scale));
this.repairRight(parseInt(this.style_height * this._scale));
},
//比例缩放左上
scaleLeftUp: function(oEvent) {
this.SetLeft(oEvent);
this.repairUp(parseInt(this.style_width / this._scale));
this.repairLeft(parseInt(this.style_height * this._scale));
},
//这里是高度优先用于上下两边(体验更好)
//比例缩放下右
scaleDownRight: function(oEvent) {
this.SetDown(oEvent);
this.repairRight(parseInt(this.style_height * this._scale));
this.repairDown(parseInt(this.style_width / this._scale));
},
//比例缩放上右
scaleUpRight: function(oEvent) {
this.SetUp(oEvent);
this.repairRight(parseInt(this.style_height * this._scale));
this.repairUp(parseInt(this.style_width / this._scale));
},
//修正程序
//修正右边
repairRight: function(iWidth) {
//右边和下边只要设置宽度和高度就行
//当少于最少宽度
if (iWidth < this.MinWidth){ iWidth = this.MinWidth; }
//当超过当前设定的最大宽度
if(this.Limit && iWidth > this._mxRight){ iWidth = this._mxRight; }
//修改样式
this.style_width = iWidth;
},
//修正下边
repairDown: function(iHeight) {
if (iHeight < this.MinHeight){ iHeight = this.MinHeight; }
if(this.Limit && iHeight > this._mxDown){ iHeight = this._mxDown; }
this.style_height = iHeight;
},
//修正左边
repairLeft: function(iWidth) {
//左边和上边比较麻烦因为还要计算left和top
//当少于最少宽度
if (iWidth < this.MinWidth){ iWidth = this.MinWidth; }
//当超过当前设定的最大宽度
else if(this.Limit && iWidth > this._mxLeft){ iWidth = this._mxLeft; }
//修改样式
this.style_width = iWidth;
this.style_left = this._obj.offsetLeft + this._obj.offsetWidth - iWidth;
},
//修正上边
repairUp: function(iHeight) {
if(iHeight < this.MinHeight){ iHeight = this.MinHeight; }
else if(this.Limit && iHeight > this._mxUp){ iHeight = this._mxUp; }
this.style_height = iHeight;
this.style_top = this._obj.offsetTop + this._obj.offsetHeight - iHeight;
},
//停止缩放
Stop: function() {
//移除事件
removeEventHandler(document, "mousemove", this._fR);
removeEventHandler(document, "mouseup", this._fS);
if(isIE){
removeEventHandler(this._touch, "losecapture", this._fS);
this._touch.releaseCapture();
}else{
removeEventHandler(window, "blur", this._fS);
}
this._touch = null;
}
};