<div class="codetitle"> <span><a style="CURSOR: pointer" data="75567" class="copybut" id="copybut75567" onclick="doCopy('code75567')"><u>コードをコピー</u></a></span> コードは次のとおりです:</div> <div class="codebody" id="code75567"> <br><!DOCTYPE html PUBLIC "-//W3C/ /DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <br><html xmlns="http://www.w3 .org/ 1999/xhtml"> <br><head> <br><meta http-equiv="Content-Type" content="text/html" /> <br>< title</title> <br><script type="text/javascript" src="http://demo.jb51.net/jslib/jquery/jquery.js"></script> 🎜> <style type="text/css"> <br>*{margin: 0;padding: 0;} <br>#drag{background: #ccc;height: 200px;width: 300px;text-align : センター ;line-height: 200px;position: 絶対;left: 20px;top: 20px;} <br></style> <br><div id="drag"> <br>ドラッグできるよ！ ！ <br></div> <br><script type="text/javascript"> <br>//jquery メソッド ドラッグ<br>/**$(function(){ <br>var move = false; // 移動されたかどうか判断 <br>var a = 0; <br>var b = 0; <br>$("#drag").mousedown(function (イベント){ <br>move = true; <br>a =event.pageX - parseInt($("#drag").css("left")); <br>b = events.pageY - parseInt($ ("#drag").css("top")); <br>}) <br>$(document).mousemove(function(event){ <br>if(move){ <br>var x = イベント.pageX - a; <br>var y = イベント.pageY - b; <br>$("#drag").css({left: x,top: y}) <br>} <br>})。 Mouseup(function(){ <br>move = false; <br>}) <br>})**/ <br>//単純な JS 全般Method <br>/**var ドラッグ = document.getElementById("ドラッグ"); <br>var a = 0; <br>var b = 0; <br>drag.onmousedown = function(event){ <br>var イベント = イベント||window.event; <br>a =event.clientX-drag.offsetLeft; <br>b =event.clientY-drag.offsetTop; <br>drag.onmousemove = function(event){ <br>var イベント = イベント||window.event; <br>var x = events.clientX - a; <br>var y = イベント.clientY - b; <br>drag.style.left = x "px"; <br>drag.style.top = y "px"; <br>} <br>document.onmouseup=function(){ <br>drag.onmousemove = null; <br>drag.onmouseup = null; <br>} <br>}**/ <br>//js オブジェクト指向メソッド <br>function Drag(obj){ <br>this.drag = document.getElementById(obj); / /アラート(obj); <br>this.a = 0; <br>this.b = 0; <br>this.drag.onmousedown = function(event){<br>that .マウスダウン(イベント); <br>} <br>} <br>Drag.prototype.mousedown = function(event){ <br>var イベント = イベント||window.event; <br>this.a = イベント。 -this.drag.offsetLeft; <br>this.b = events.clientY-this.drag.offsetTop; <br>document.onmousemove=function(event){ <br>that. (イベント) <br>} <br>document.onmouseup=function(){ <br>that.mouseup() <br>} <br>} <br>Drag.prototype.mousemove = function(event){ <br>var イベント = イベント||ウィンドウ.イベント; <br>var x = イベント.clientX - this.a; <br>var y =event.clientY - this.b; x "px"; <br>this.drag.style.top = y "px"; <br>Drag.prototype.mouseup=function(){ <br>document.onmousemove = null; document.onmouseup = null; <br>new Drag("drag"); <br></html> ></div>
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
