JavaScript js div层拖拽(兼容IE6、FF)时间:2022-08-25 20:21:45最近在论坛里经常看到有人问div拖拽层的问题。根据其中的一个帖子上的代码,本人稍作修改。现在功能已经实现,并且兼容FF、IE。代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <title>dragDiv.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"><style type="text/css">body {font-family:Verfana;font-size:11px;color:#333333;}#win {position:absolute;left:50px;top:50px;width:200px;height:150px;border:1px solid #000000;background:yellow;}</style><script type="text/javascript">var win;var left = 50;var top = 50;var move = false;function init() { win = document.getElementById("win"); win.onmousedown = startDrag; win.onmousemove = drag; win.onmouseup = stopDrag;}window.onload = init;function startDrag(event) {event = event || window.event;var x = event.pageX || event.x; var y = event.pageY || event.y; left = x - left; top = y - top; win.style.background = "red"; move = true;}function drag(event) { if(move) {event = event || window.event; win.style.background = "blue"; var x = event.pageX || event.x; var y = event.pageY || event.y; win.style.left = x - left + "px"; win.style.top = y - top + "px"; //captureEvents(); //win.setCapture(); if (!window.captureEvents) { win.setCapture(); } else {captureEvents(); //window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP); } }}function stopDrag(event) {event = event || window.event; win.style.background="yellow"; var x = event.pageX || event.x; var y = event.pageY || event.y; left = x - left; top = y - top; move = false; //routeEvent(); //win.releaseCapture(); if (!window.releaseEvents) { win.releaseCapture(); } else { releaseEvents(); //window.releaseEvents(Event.MOUSEMOVE|Event.MOUSEUP); }}</script> </head> <body><div id="win"></div></body></html>