以下は、jQuery を使用してドラッグ可能なフローティング レイヤーを実装するための完全なコードです。これをコピーして HTML ファイルに保存すると、効果を体験できます。次の Web サイトにアクセスして効果を体験することもできます: http://www.keleyi.com/keleyi/phtml/dragdiv.htm カーソルをレイヤーに移動し、マウスを押したままレイヤーをドラッグします。 。 コードをコピー コードは次のとおりです: .org/1999/xhtml"> ;head> jQuery はドラッグ可能なフローティング レイヤー (バージョン 2) を実装します- Keleyi /script> <br><style type="text/css"> 位置:絶対; 左:200px; 背景:#8a9bca; :move;} <br></style> <br><script type="text/javascript"> <br>$(document ).ready(function (e) { <br>$(".box ").mousedown(function (e) { <br>iDiffX = e.pageX - $(this).offset().left; <br> iDiffY = e.pageY - $(this).offset().top; <br>$(document).mousemove(function (e) { <br>$(".box").css({ "left": (e.pageX - iDiffX), "top": (e.pageY - iDiffY) }); <br>}); <br>$(".box").mouseup(function () { <br>$(document).unbind("mousemove"); 🎜>}) <br>}); <br> ！ カーソルをレイヤーに移動し、マウスを押したままレイヤーをドラッグします。 Keleyi www.keleyi.com /body>
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
