ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript マウス ドラッグ アイコン technology_javascript スキル

JavaScript マウス ドラッグ アイコン technology_javascript スキル

WBOY
リリース: 2016-05-16 18:35:00
オリジナル
1027 人が閲覧しました

この例は、マウスを移動したい場所にドラッグするだけです。
コード

コードをコピー コードは次のとおりです。


; /div>
<script> <br>var bb = document.getElementById("block"); <br>bb.onmousedown = function(){ <br>//マウスの現在の座標を取得します🎜>var pageX =event.clientX; <br>var pageY =event.clientY; <br>//ブロック、左境界線、上境界線の座標を取得します<br>var offX = parseInt(this.style.left) ||0; <br>var offY = parseInt(this.style.top)||0; <br>//マウス座標とブロック座標の間の距離を計算します<br>var offLX = pageX-offX; >var offLY = pageY-offY ; <br>if(!document.onmousemove){ <br>document.onmousemove = function(){ <br>bb.style.left=event.clientX-offLX;ブロックの座標 <br>bb. style.top=event.clientY-offLY // ブロックの Y 座標を設定します <br>} <br>} <br>document.onmouseup = function(){ document.onmousemove = null;} //マウスバウンス<br></script>

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート