<html>
<head>
<title>javascript拖動DIV</title>
<style>
body{
font-family:Verdana;
font-size:11px;
color:#333;
}
#win1{
position:absolute;
left:100;
top:100;
height:150px;
border:1px solid #000;
}
.title{
background:#000;
height:18px;
color:#fff;
cursor: move;
}
</style>
</head>
<body>
<script>
var move=false;
function StartDrag(obj)
{
if(event.button==1&&event.srcElement.tagName.toUpperCase()=="DIV")
{
obj.setCapture();
obj.style.background="#999";
move=true;
}
}function Drag(obj)
{
if(move)
{
var oldwin=obj.parentNode;
oldwin.style.left=event.clientX-100;
oldwin.style.top=event.clientY-10;
}
}function StopDrag(obj)
{
obj.style.background="#000";
obj.releaseCapture();
move=false;
}
</script>
<div id="win1">
<div class="title" onMousedown="StartDrag(this)" onMouseup="StopDrag(this)" onMousemove="Drag(this)" >1</div>
This is a moveable window.<br>
Moreinfo in
</div>
</body>
</html>
IE下拖動DIV
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章