浏览器实现ACDSEE看图功能之--用鼠标移动观看图形

王朝html/css/js·作者佚名 2006-12-17

浏览器实现ACDSEE看图功能之--用鼠标移动观看图形 <style>

* {cursor:hand}

</style>

* author: wanghr100(灰豆宝宝.net)

* e-mail: wanghr100@hotmail.com

*/ //初始化

var x=0;

var y=0;

function baoDrag() {

//记录鼠标所点的位置,X,Y.

var x=event.clientX;

var y=event.clientY;

document.attachEvent("onmousemove",moveHandler);

document.attachEvent("onmouseup",upHandler);

event.cancelBubble=true;

event.returnValue=false;

function moveHandler() {

//先捕获鼠标新的位置,和鼠标点击开始拖动之差为要滚动量.

var newx=event.clientX-x;

var newy=event.clientY-y;

//更新鼠标位置.

x=event.clientX;

y=event.clientY;

//开始移动

window.scrollBy(-newx,-newy);

event.cancelBubble=true;

}

function upHandler() {

//鼠标松开.注销相关事件.

document.detachEvent("onmouseup",upHandler);

document.detachEvent("onmousemove",moveHandler);

event.cancelBubble=true;

}

//加入鼠标事件.拖动开始.

document.onmousedown=baoDrag;

//屏蔽选择图片.

document.onselectstart=new Function("event.returnValue=false")

</script>

<body>