?? sndrag.htc
字號:
<PUBLIC:COMPONENT>
<PUBLIC:ATTACH EVENT="oncontentready" ONEVENT="snInit()" />
<PUBLIC:ATTACH EVENT="onmouseover" ONEVENT="changeCursor()" />
<PUBLIC:ATTACH EVENT="onmouseout" ONEVENT="backCursor()" />
<!--public:attach event="ondblclick" onevent="setPropertise()" /-->
<public:attach event="onkeydown" onevent="miliAdjust()" />
<PUBLIC:EVENT NAME="onBeginDrag" ID="bdID" />
<PUBLIC:EVENT NAME="onDraging" ID="dID" />
<PUBLIC:EVENT NAME="onEndDrag" ID="edID" />
<PUBLIC:EVENT NAME="onSelected" ID="sID" />
<PUBLIC:METHOD NAME="locked" />
<PUBLIC:METHOD NAME="unlocked" />
<PUBLIC:PROPERTY NAME="lock" />
<PUBLIC:PROPERTY NAME="isEndDrag" />
<script>
/**
* 給控件增加拖動的功能
* @author shennan
* @date 20060426
* @lastModify 20080104
* @property isEndDrag 這個(gè)是給調(diào)用者使用的,目的在于判斷是否開始拖動。
*/
var top,left;
var oldTop,oldLeft;
var newTop,newLeft;
var isDrag;
var lock;
var isIn; //鼠標(biāo)是否在控件內(nèi)
function snInit(){
top=element.style.top;
left=element.style.left;
isDrag=false;
isIn=false;
if(lock==null)lock=false;
this.isEndDrag=false;
element.onselectstart=function(){return false;};
}
function changeCursor(){
//設(shè)置焦點(diǎn)
event.cancelBubble=true;
if(isIn)return;
isIn=true;
element.style.cursor="hand";
//element.style.border="solid 1px #ff3333";
window.document.body.attachEvent("onmousedown",beginDrag);
window.document.body.attachEvent("onmouseup",endDrag);
window.document.body.attachEvent("onmousemove",draging);
}
function backCursor(){
//恢復(fù)焦點(diǎn)
if(!isIn)return;
if(isDrag)return;
element.style.cursor="auto";
//element.style.border="solid 1px #000000";
isIn=false;
window.document.body.detachEvent("onmousedown",beginDrag);
window.document.body.detachEvent("onmouseup",endDrag);
window.document.body.detachEvent("onmousemove",draging);
}
function beginDrag(){
//開始拖動
if(!isIn){isDrag=false;return;}
if(lock)return;
isDrag=true;
this.isEndDrag=true;
top=element.style.posTop;
left=element.style.posLeft;
oldTop=parseInt(event.y);
oldLeft=parseInt(event.x);
// element.innerHTML="x:"+oldLeft+",Y:"+oldTop;
//回掉事件
var oEvent = createEventObject();
oEvent.top=parseInt(element.style.posTop);
oEvent.left=parseInt(element.style.posLeft);
bdID.fire(oEvent);
}
function endDrag(){
//結(jié)束拖動
if(!isIn)return;
var oEvent = createEventObject();
oEvent.top=parseInt(element.style.posTop);
oEvent.left=parseInt(element.style.posLeft);
oEvent.srcElement=element;
sID.fire(oEvent);//選擇
if(!isDrag)return;
isDrag=false;
//回掉事件
edID.fire(oEvent); //結(jié)束
}
function draging(){
//開始拖動
if(lock)return;
if(!isDrag)return;
newTop=parseInt(event.y);
newLeft=parseInt(event.x);
element.style.posLeft=left + (newLeft - oldLeft);
element.style.posTop=top + (newTop - oldTop);
// element.innerHTML="x:"+newLeft+",Y:"+newTop;
//回掉事件
var oEvent = createEventObject();
oEvent.top=parseInt(element.style.posTop);
oEvent.left=parseInt(element.style.posLeft);
dID.fire(oEvent);
}
function locked(){//鎖定
lock=true;
}
function unlocked(){//開鎖
lock=false;
}
function setPropertise(){
//設(shè)置一系列屬性
if(lock)lock=false;
else lock=true;
}
function miliAdjust(){
if(lock)return;
var code=event.keyCode;
event.cancelBubble=true;
switch(code){
case 37://左
element.style.posLeft=parseInt(element.style.posLeft) - 1;
break;
case 38://上
element.style.posTop=parseInt(element.style.posTop) - 1;
break;
case 39://右
element.style.posLeft=parseInt(element.style.posLeft) + 1;
break;
case 40://下
element.style.posTop=parseInt(element.style.posTop) + 1;
break;
}
}
</script>
</PUBLIC:COMPONENT>
?? 快捷鍵說明
復(fù)制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -