効果：
アイデア：
onmousemove イベントを使用してマウスの座標を取得し、DIV を 1 つずつ走査し、最後にマウスの座標を DIV に割り当てます。
コード：
次のようにコードをコピーします。
<head runat="サーバー">
<タイトル></タイトル>
<style type="text/css">
ディビジョン
{
幅: 20ピクセル;
高さ: 20ピクセル;
背景: #00FFFF;
位置: 絶対;
}
</スタイル>
<script type="text/javascript">
document.onmousemove = 関数 (ev) {
var div = document.getElementsByTagName('div');
var oEvent = ev || 互換性を決定します。
var pos = GetMouse(oEvent); //互換性を判断した後、マウス座標を移動する関数を使用して水平座標と垂直座標を取得します。
for (var i = div.length - 1; i > 0; i--) { //最後の DIV から開始して DIV を走査します。
div[i].style.left = div[i - 1].offsetLeft + 'px'; //前の offsetLeft を次の offsetLeft に渡します。
div[i].style.top = div[i - 1].offsetTop + 'px' //前の offsetTop を次の offsetTop に渡す
}
div[0].style.left = pos.x + 'px' //マウスの横座標を最初の座標に与える
div[0].style.top = pos.y + 'px' //最初のマウスにマウスの垂直座標を与える
}
function GetMouse(ev) { //マウスの移動座標を取得
var スクロールトップ = document.documentElement.scrollTop || document.body.scrollTop;
varscrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
return { x: ev.clientX +scrollLeft, y: ev.clientY +scrollTop }
}
</script>
</head>
<本文>
<div>
</div>
<div>
</div>
<div>
</div>
<div>
</div>
<div>
</div>
<div>
</div>
<div>
</div>
<div>
</div>
<div>
</div>
<div>
</div>
<div>
</div>
<div>
</div>
<div>
</div>
</body>