复制代码代码如下:
<html>
<голова>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Изменить размер</title>
<style type="text/css">
#rRightDown,#rLeftDown,#rLeftUp,#rRightUp,#rRight,#rLeft,#rUp,#rDown{
позиция: абсолютная; фон: # C00; ширина: 6 пикселей; высота: 6 пикселей; z-индекс: 5; размер шрифта: 0;}
#rLeftDown,#rRightUp{курсор:ne-resize;}
#rRightDown,#rLeftUp{курсор:nw-resize;}
#rRight,#rLeft{курсор:e-resize;}
#rUp,#rDown{курсор:n-resize;}
#rRightDown{внизу:-3px; вправо: -3px;}
#rLeftDown{внизу:-3px; слева:-3px;}
#rRightUp{ верх:-3px; вправо: -3px;}
#rLeftUp{ верх:-3px; слева:-3px;}
#rRight{право:-3px; верх:50%}
#rLeft{ влево:-3px; верх:50%}
#rUp{ верх:-3px; осталось:50%}
#rDown{внизу:-3px; осталось:50%}
</стиль>
</голова>
<тело>
<div id='ss' style="высота:100 пикселей; ширина: 100 пикселей; граница: 1 пиксель сплошной #000000; позиция: абсолютная; слева: 200 пикселей; сверху: 200 пикселей;" >
<div id="rRightDown"> </div>
<div id="rLeftDown"> </div>
<div id="rRightUp"> </div>
<div id="rLeftUp"> </div>
<div id="rRight"> </div>
<div id="rLeft"> </div>
<div id="rUp"> </div>
<div id="rDown"></div>
</div>
<скрипт>
var Sys = (function(ua){
вар с = {};
s.IE = ua.match(/msie ([/d.]+)/)?true:false;
s.Firefox = ua.match(/firefox//([/d.]+)/)?true:false;
s.Chrome = ua.match(/chrome//([/d.]+)/)?true:false;
s.IE6 = (s.IE&&([/MSIE (/d)/.0/i.exec(navigator.userAgent)][0][1] == 6))?true:false;
s.IE7 = (s.IE&&([/MSIE (/d)/.0/i.exec(navigator.userAgent)][0][1] == 7))?true:false;
s.IE8 = (s.IE&&([/MSIE (/d)/.0/i.exec(navigator.userAgent)][0][1] == 8))?true:false;
вернуть с;
})(navigator.userAgent.toLowerCase());
вар $ = функция (id) {
вернуть документ.getElementById(id);
};
вар Css = функция (е, о) {
for(var i in o)
e.style[i] = o[i];
};
вар Extend = функция (назначение, источник) {
for (свойство var в исходном коде) {
назначение [свойство] = источник [свойство];
}
};
вар Bind = функция (объект, развлечение) {
var args = Array.prototype.slice.call(arguments).slice(2);
функция возврата() {
вернуть fun.apply(object, args);
}
};
вар BindAsEventListener = функция (объект, удовольствие) {
var args = Array.prototype.slice.call(arguments).slice(2);
возвращаемая функция (событие) {
return fun.apply(object, [event || window.event].concat(args));
}
};
вар CurrentStyle = функция (элемент) {
вернуть элемент.currentStyle || document.defaultView.getComputedStyle(элемент, ноль);
};
функция addListener(element,e,fn){
element.addEventListener?element.addEventListener(e,fn,false):element.attachEvent("on" + e,fn);
};
функция RemoveListener(element,e,fn){
element.removeEventListener?element.removeEventListener(e,fn,false):element.detachEvent("on" + e,fn)
};
вар Класс = функция (свойства) {
var _class = function(){return (arguments[0] !== null && this.initialize && typeof(this.initialize) == 'function') ? this.initialize.apply(this, аргументы): это;};
_class.prototype = свойства;
вернуть _класс;
};
вар Resize = новый класс({
инициализировать: функция (объект) {
this.obj = объект;
this.resizeelm = ноль;
this.fun = ноль; //记录触发什么事件的索引
this.original = []; //记录开始状态的数组
this.width = ноль;
this.height = ноль;
this.fR = BindAsEventListener(this,this.resize);
this.fS = Bind(this,this.stop);
},
set: функция(вяз,направление){
если(!elm)возврат;
this.resizeelm = вяз;
addListener(this.resizeelm,'mousedown',BindAsEventListener(this, this.start, this[направление]));
верните это;
},
начало: функция (е, веселье) {
this.fun = веселье;
this.original = [parseInt(CurrentStyle(this.obj).width),parseInt(CurrentStyle(this.obj).height),parseInt(CurrentStyle(this.obj).left),parseInt(CurrentStyle(this.obj). вершина)];
this.width = (this.original[2]||0) + this.original[0];
this.height = (this.original[3]||0) + this.original[1];
addListener(document, "mousemove",this.fR);
addListener(document,'mouseup',this.fS);
},
изменить размер: функция (е) {
это.fun(е);
Sys.IE?(this.resizeelm.onlosecapture=function(){this.fS()}):(this.resizeelm.onblur=function(){this.fS()})
},
стоп: функция(){
RemoveListener(document, "mousemove", this.fR);
RemoveListener(document, "mousemove", this.fS);
окно.getSelection? window.getSelection().removeAllRanges(): document.selection.empty();
},
вверх: функция(е){
this.height>e.clientY?Css(this.obj,{top:e.clientY + "px",height:this.height-e.clientY + "px"}):this.turnDown(e);
},
вниз: функция(е){
e.clientY>this.original[3]?Css(this.obj,{top:this.original[3]+'px',height:e.clientY-this.original[3]+'px'}): this.turnUp(e);
},
слева: функция (е) {
e.clientX<this.width?Css(this.obj,{left:e.clientX +'px',width:this.width-e.clientX + "px"}):this.turnRight(e);
},
справа: функция(е){
e.clientX>this.original[2]?Css(this.obj,{left:this.original[2]+'px',width:e.clientX-this.original[2]+"px"}): this.turnLeft(e) ;
},
leftUp:function(e){
this.up(e);this.left(e);
},
leftDown: функция (е) {
this.left(e);this.down(e);
},
rightUp: функция (е) {
это.вверх(е);это.право(е);
},
rightDown: функция (е) {
это.справа(е);это.вниз(е);
},
поворот вниз : функция(е){
Css(this.obj,{top:this.height+'px',height:e.clientY - this.height + 'px'});
},
TurnUp : функция(е){
Css(this.obj,{top: e.clientY +'px',height: this.original[3] - e.clientY +'px'});
},
поворот вправо : функция(е){
Css(this.obj,{left:this.width+'px',width:e.clientX- this.width +'px'});
},
поворот влево: функция(е){
Css(this.obj,{left:e.clientX +'px',width:this.original[2]-e.clientX+'px'});
}
});
window.onload = функция(){
новый Resize($('ss')).set($('rUp'),'up').set($('rDown'),'down').set($('rLeft'),'left' ).set($('rRight'),'right').set($(' rLeftUp'),'leftUp').set($('rLeftDown'),'leftDown').set($('rRightDown'),'rightDown').set($('rRightUp'),'rightUp') ;
}
</скрипт>
</тело>
</html>