<html> <script language="javascript" src="js/jquery-1.4.2.min.js"></script> <head> </head> <body> <script type="text/javascript"> $(function(){ function drag_me(name){ $(name).css({ position:"absolute", cursor:"move" }); $(name).mousedown(function(event){ var locateX=event.pageX; var locateY=event.pageY; var obj_locateX=$(this).offset().left; var obj_locateY=$(this).offset().top; var diff_x=locateX-obj_locateX; var diff_y=locateY-obj_locateY; $(this).css("opacity",0.3).mousemove(function(event){ locateX=event.pageX; locateY=event.pageY; obj_locateX=$(this).offset().left; obj_locateY=$(this).offset().top; new_locateX=locateX-diff_x; new_locateY=locateY-diff_y; document.getElementById("hidden_id").value = new_locateX; $(this).css({ left:new_locateX, top:new_locateY }).bind("mouseup mouseout",function(){ $(this).css("opacity",1); $(this).unbind("mousemove"); }); }); }); } drag_me("div#myblock"); drag_me("div#myblock2"); }); </script> <style type="text/css"> div#myblock{ position:relative; width:150px;height:150px; display:block; background-color:#FF9966; border:#6699CC 1px solid; cursor:move; } </style> <style type="text/css"> div#myblock2{ position:relative; width:50px;height:50px; display:block; background-color:#00FF33; border:#6699CC 1px solid; cursor:move; } </style> <div id="myblock"> </div> <div id="myblock2"> </div> <form action="test2.php" name="test" method="post" > <input type="hidden" name="hidden_id" id="hidden_id"> <input type="submit" name="submit" value="submit"> </form> </body> </html>
//----- บรรทัดนี้แสดงตำแหน่งเดิม var obj_locateX=$(this).offset().left; var obj_locateY=$(this).offset().top; //------บรรทัดนี้ แสดงตำแหน่งใหม่ new_locateX=locateX-diff_x; new_locateY=locateY-diff_y;
เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง
Load balance : Server 05
