jQuery控制div層，使其移動、改變位置
阿新 • • 發佈：2019-02-01
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>test2.html</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <!--<link rel="stylesheet" type="text/css" href="./styles.css">--> <script type="text/javascript"> var b = function(){ $("body").append("<div id='hid' style='background:red;position:absolute;width:880;height:120'>我是可以拖動的半透明div，Firefox下暫時只能獲取點選事件，event無解</div>"); $("#hid").fadeTo("slow", 0.5); $("#hid").mousedown(function(event){ var offset=$("#hid").offset(); x1=event.clientX-offset.left; y1=event.clientY-offset.top; $("#hid").mousemove(function(event){ $("#hid").css("left",(event.clientX-x1)+"px"); $("#hid").css("top",(event.clientY-y1)+"px"); /* $("#hid").animate({ left : _x + "px", top : _y + "px" }, 10); */ }); $("#hid").mouseup(function(event){ $("#hid").unbind("mousemove"); }); }); } </script> </head> <body> <input type=button value="點我顯示div" onclick="b()"> </body> </html>