<html>
<head>
<title> 鼠标选取框 </title>
<script language="JavaScript">
var x0;
var y0;
var select=false;
function document.onmousedown()
{
x0=document.body.scrollLeft+event.clientX;// 鼠标起始横坐标
y0=document.body.scrollTop+event.clientY;// 鼠标起始纵坐标
select=true;
}
function document.onmouseup()
{
select=false;
}
function document.onselectstart()
{
return false;
}
function document.ondrag()
{
return false;
}
function document.onmousemove()
{
if (select)
{
dd.style.display='';// 如果鼠标已经正确移动，将层设置为可视。
if(document.body.scrollLeft+event.clientX-x0>0) // 从左向右
{
dd.style.left=x0;
dd.style.width=document.body.scrollLeft+event.clientX-x0;
}
else // 从右向左
{
dd.style.left=document.body.scrollLeft+event.clientX;
dd.style.width=x0-(document.body.scrollLeft+event.clientX);
}
if (document.body.scrollTop+event.clientY-y0>0)// 从上向下
{
dd.style.top=y0;
dd.style.height=document.body.scrollTop+event.clientY-y0;
}
else// 从下向上
{
dd.style.top=document.body.scrollTop+event.clientY;
dd.style.height=y0-(document.body.scrollTop+event.clientY);
}
}
}
</script>
</head>
<body>
<table id="dd" style="position:absolute; width:0px; height:0px; z-index:99; border:1px black dashed; display:none;"><tr><td></td></tr></table>
</body>
</html>