<html><head> <style> body {background-color: } .moveplate{ position: absolute; padding: 4px; font-family:verdana; font-size: 10px; line-height: 10px; } </style> <script language='JavaScript'> objMove = null; mousex = 0; mousey = 0; offx = 0; offy = 0; function getMouseXY(e) { if (!e) e = window.event; if (e) { if (e.pageX || e.pageY) { mousex = e.pageX; mousey = e.pageY; } else if (e.clientX || e.clientY) { mousex = e.clientX + document.body.scrollLeft; mousey = e.clientY + document.body.scrollTop; } } } function init() { document.onmousemove = update; update(); } function update(e) { getMouseXY(e); document.getElementById('showXY').value = 'x:=' + mousex + ' , y:=' + mousey; } function drag(e) { if (objMove) { getMouseXY(e); objMove.style.left = mousex - offx + 'px'; objMove.style.top = mousey - offy + 'px'; document.getElementById('showXY').value = 'x:=' + mousex + ' , y:=' + mousey; } return false; } function falsefunc() { return false; } function startMove(obj, e) { objMove = obj; document.onmousedown = falsefunc; document.onmousemove = drag; document.onmouseup = stopMove; objMove.style.cursor = 'pointer'; getMouseXY(e); offx = mousex - objMove.offsetLeft; offy = mousey - objMove.offsetTop; } function stopMove() { objMove.style.cursor = 'default'; objMove = null; document.onmousemove = update; document.onmouseup = null; document.getElementById('showXY1').value = 'x:=' + mousex + ' , y:=' + mousey; document.getElementById('showXY2').value = mousex; document.getElementById('showXY3').value = mousey; } </script> </head> <body onload="init()"> <table width='800' border='1'> <tr> <form action=' ' method='post' > <input type='text' id='showXY1' > <input type='hidden' id='showXY2' name='mx'> <input type='hidden' id='showXY3' name='my'> <input type='submit' value='เก็บ' > </form> <td width='20%'> </td> <td bgcolor='#CCFFFF' width='80%' height='450' align='center'> <div class='moveplate' style='top:100; left:54' onmousedown='startMove(this);'><img src='img1.jpg' width='80' height='80'></div> <div class='moveplate' style='top:200; left:54' onmousedown='startMove(this);'><img src='img2.jpg' width='80' height='80'></div> <div class='moveplate' style='top:300; left:54' onmousedown='startMove(this);'><img src='img3.jpg' width='80' height='80'></div> </td> </tr> </table> </body></html>
เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง
