Memengaruhi:
Ide:
Gunakan pengatur waktu setInterval untuk pergerakan, offsetWidth untuk mengubah lebar, dan gunakan onmouseover untuk memasukkan titik akhir dan DIV yang dipilih ke dalam parameter sebelum melakukan buffering pada pergerakan.
Kode:
Copy kode kodenya sebagai berikut:
<head runat="server">
<judul></judul>
<gaya tipe="teks/css">
div
{
lebar: 100 piksel;
tinggi: 50 piksel;
latar belakang: #0000FF;
margin: 10 piksel;
}
</gaya>
<skrip tipe="teks/javascript">
jendela.onload = fungsi () {
var oDiv = dokumen.getElementsByTagName('div');
for (var i = 0; i < oDiv.panjang; i++) {
oDiv[i].timer = null; //Tandai DIV untuk menutup pengatur waktu DIV yang bersangkutan
oDiv[i].onmouseover = fungsi () {
move(this, 400); //Berikan parameter keluaran pengatur waktu
}
oDiv[i].onmouseout = fungsi () {
pindah(ini, 100);
}
}
};
fungsi pindah(div, akhir) {
clearInterval(div.timer);
div.timer = setInterval(fungsi () {
var speed = (end - div.offsetWidth) / 5; // (end - width to go) / faktor penskalaan = kecepatan pergerakan DIV
speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed); // Pembulatan desimal, yaitu pembulatan dengan carry
if (div.offsetWidth == end) {//Menutup timer ketika waktunya telah tiba
clearInterval(div.timer);
}
kalau tidak {
div.style.width = div.offsetWidth + speed + 'px'; //Pindahkan lebar DIV
}
}, 30)
}
</skrip>
</kepala>
<tubuh>
<div>
</div>
<div>
</div>
<div>
</div>
</tubuh>