Memengaruhi:
Ide:
Gunakan event onmousemove untuk mendapatkan koordinat mouse, lalu lintasi DIV satu per satu, dan terakhir tetapkan koordinat mouse ke DIV.
Kode:
Copy kode kodenya sebagai berikut:
<head runat="server">
<judul></judul>
<gaya tipe="teks/css">
div
{
lebar: 20 piksel;
tinggi: 20 piksel;
latar belakang: #00FFFF;
posisi: mutlak;
}
</gaya>
<skrip tipe="teks/javascript">
dokumen.onmousemove = fungsi (ev) {
var div = dokumen.getElementsByTagName('div');
var oEvent = ev ||.event; //Tentukan kompatibilitas
var pos = GetMouse(oEvent); //Setelah menentukan kompatibilitas, gunakan fungsi menggerakkan koordinat mouse untuk mendapatkan koordinat horizontal dan vertikal
for (var i = div.length - 1; i > 0; i--) { //Melintasi DIV, dimulai dari yang terakhir.
div[i].style.left = div[i - 1].offsetLeft + 'px'; //Berikan offsetLeft sebelumnya ke offsetLeft berikutnya
div[i].style.top = div[i - 1].offsetTop + 'px'; //Berikan offsetTop sebelumnya ke offsetTop berikutnya
}
div[0].style.left = pos.x + 'px'; //Berikan absis mouse ke yang pertama
div[0].style.top = pos.y + 'px'; //Berikan koordinat vertikal mouse ke koordinat pertama
}
function GetMouse(ev) {//Mendapatkan koordinat pergerakan mouse
var scrollTop = dokumen.documentElement.scrollTop ||.dokumen.body.scrollTop;
var scrollLeft = dokumen.documentElement.scrollLeft ||.dokumen.body.scrollLeft;
kembali { x: ev.clientX + scrollLeft, y: ev.clientY + scrollTop }
}
</skrip>
</kepala>
<tubuh>
<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>
</tubuh>