2008-04-26
div resize
http://topic.csdn.net/t/20030522/16/1819974.html
<html>
<head>
<title>div test</title>
<script language="javascript">
var mouseX = 0;
var mouseY = 0;
function divonmousemove(obj)
{
if ((Math.abs(obj.offsetLeft+obj.offsetWidth-event.x)<4) && (Math.abs(obj.offsetTop+obj.offsetHeight-event.y)<4))
obj.style.cursor='se-resize';
else if (Math.abs(obj.offsetLeft+obj.offsetWidth-event.x)<4) obj.style.cursor='e-resize';
else if (Math.abs(obj.offsetTop+obj.offsetHeight-event.y)<4) obj.style.cursor='s-resize';
else
obj.style.cursor='';
if (event.button==1)
{
obj.style.width = parseInt(obj.offsetWidth) + (event.x - mouseX);
mouseX = event.x;
obj.style.height = parseInt(obj.offsetHeight) + (event.y - mouseY);
mouseY = event.y;
}
}
function divonmousedown(obj)
{
mouseX = event.x;
mouseY = event.y;
}
function divonmouseup(obj)
{
mouseX = 0;
mouseY = 0;
}
</script>
</head>
<body align="center">
<div onmousemove="divonmousemove(this);" onmouseleave="this.style.cursor='';"
onmousedown="divonmousedown(this);" onmouseup="divonmouseup(this);"
style="width:100px;;height:200;background:green;float:left;" title="按下鼠标拖动大小">
xxxxxxxxxxxxx
</div>
<div onmousemove="divonmousemove(this);" onmouseleave="this.style.cursor='';"
onmousedown="divonmousedown(this);" onmouseup="divonmouseup(this);"
style="width:100px;height:200;background:red;float:left;" title="按下鼠标拖动大小">
yyyyyyyyyyyyyy
</div>
<div onmousemove="divonmousemove(this);" onmouseleave="this.style.cursor='';"
onmousedown="divonmousedown(this);" onmouseup="divonmouseup(this);"
style="width:100px;height:200;background:blue;float:left;" title="按下鼠标拖动大小">
yyyyyyyyyyyyyy
</div>
<div onmousemove="divonmousemove(this);" onmouseleave="this.style.cursor='';"
onmousedown="divonmousedown(this);" onmouseup="divonmouseup(this);"
style="width:100px;height:200;background:#EDEDDD;float:left;" title="按下鼠标拖动大小">
yyyyyyyyyyyyyy
</div>
</body>
</html>
引用
<html>
<head>
<title>div test</title>
<script language="javascript">
var mouseX = 0;
var mouseY = 0;
function divonmousemove(obj)
{
if ((Math.abs(obj.offsetLeft+obj.offsetWidth-event.x)<4) && (Math.abs(obj.offsetTop+obj.offsetHeight-event.y)<4))
obj.style.cursor='se-resize';
else if (Math.abs(obj.offsetLeft+obj.offsetWidth-event.x)<4) obj.style.cursor='e-resize';
else if (Math.abs(obj.offsetTop+obj.offsetHeight-event.y)<4) obj.style.cursor='s-resize';
else
obj.style.cursor='';
if (event.button==1)
{
obj.style.width = parseInt(obj.offsetWidth) + (event.x - mouseX);
mouseX = event.x;
obj.style.height = parseInt(obj.offsetHeight) + (event.y - mouseY);
mouseY = event.y;
}
}
function divonmousedown(obj)
{
mouseX = event.x;
mouseY = event.y;
}
function divonmouseup(obj)
{
mouseX = 0;
mouseY = 0;
}
</script>
</head>
<body align="center">
<div onmousemove="divonmousemove(this);" onmouseleave="this.style.cursor='';"
onmousedown="divonmousedown(this);" onmouseup="divonmouseup(this);"
style="width:100px;;height:200;background:green;float:left;" title="按下鼠标拖动大小">
xxxxxxxxxxxxx
</div>
<div onmousemove="divonmousemove(this);" onmouseleave="this.style.cursor='';"
onmousedown="divonmousedown(this);" onmouseup="divonmouseup(this);"
style="width:100px;height:200;background:red;float:left;" title="按下鼠标拖动大小">
yyyyyyyyyyyyyy
</div>
<div onmousemove="divonmousemove(this);" onmouseleave="this.style.cursor='';"
onmousedown="divonmousedown(this);" onmouseup="divonmouseup(this);"
style="width:100px;height:200;background:blue;float:left;" title="按下鼠标拖动大小">
yyyyyyyyyyyyyy
</div>
<div onmousemove="divonmousemove(this);" onmouseleave="this.style.cursor='';"
onmousedown="divonmousedown(this);" onmouseup="divonmouseup(this);"
style="width:100px;height:200;background:#EDEDDD;float:left;" title="按下鼠标拖动大小">
yyyyyyyyyyyyyy
</div>
</body>
</html>
评论排行榜