js 容易拖动
日期：2014-05-16 浏览次数：20356 次
?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
<html>
? <head>
??? <base href="<%=basePath%>">
???
??? <title>。。。。</title>
???
?<meta http-equiv="pragma" content="no-cache">
?<meta http-equiv="cache-control" content="no-cache">
?<meta http-equiv="expires" content="0">???
?<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
?<meta http-equiv="description" content="This is my page">
?<script type="text/javascript">
?var x0=0,y0=0,x1=0,y1=0;
var moveable=false;
//开始拖动;
function startDrag(obj){
?if(event.button==1){
? obj.setCapture();
? var win = obj.parentNode;
? x0 = event.clientX;
? y0 = event.clientY;
? x1 = parseInt(win.offsetLeft);
? y1 = parseInt(win.offsetTop);
? moveable = true;
?}
}
//拖动;
function drag(obj){
?if(moveable){
? var win = obj.parentNode;
? win.style.left = x1 + event.clientX - x0;
? win.style.top = y1 + event.clientY - y0;
?}
}
//停止拖动;
function stopDrag(obj){
?if(moveable){
? obj.releaseCapture();
? moveable = false;
?}
}
?</script>
? </head>
? <body style="margin: 0px;padding: 0px;">
? ?<div style="width: 100%;height: 50px;"><img src="images/title.jpg" style="width: 100%;height:?100%"/></div>
? ?<div style="margin:auto;width: 100%;height:600px;background-image: url(images/gradient-bg.gif);background-repeat:repeat-y;text-align:center;">
? ?<div style="margin:auto;" ><img src="<%=url %>"? onmousedown="startDrag(this)" onmouseup="stopDrag(this)" onmousemove="drag(this)" style="width: 100%;height: 100%"/></div>
? ?</div>
? </body>
</html>
