Artikel ini menjelaskan metode JavaScript untuk mewujudkan tampilan bertahap pemutaran gambar. Bagikan untuk referensi Anda. Metode implementasi spesifik adalah sebagai berikut:
Salin kode sebagai berikut: <Html>
<Title> Loop gambar secara bertahap menampilkan kode efek playback </iteme>
<head>
<!-1. Masukkan kode berikut antara <head> </head> dari heml: ->
<bahasa skrip = javascript>
<!-//
sandra0 = gambar baru ();
sandra0.src = "/images/m01.jpg";
sandra1 = gambar baru ();
sandra1.src = "/images/m02.jpg";
sandra2 = gambar baru ();
sandra2.src = "/images/m03.jpg";
var i_strngth = 1
var i_image = 0
var imageUrl = array baru ()
ImageUrl [0] = "/gambar/m01.jpg"
ImageUrl [1] = "/gambar/m02.jpg"
ImageUrl [2] = "/gambar/m03.jpg"
function showImage () {
if (document.all) {
if (i_strngth <= 110) {
testimage.innerHtml = "<img style = 'filter: alpha (opacity ="+i_strngth+")' src ="+imageUrl [i_image]+"border = 0>";
i_strngth = i_strngth+10
var timer = setTimeout ("showImage ()", 100)
}
kalau tidak {
ClearTimeout (timer)
var timer = setTimeout ("hideimage ()", 1000)
}
}
if (document.layers) {
ClearTimeout (timer)
document.testimage.document.write ("<img src ="+imageUrl [i_image]+"border = 0>")
document.close ()
i_image ++
if (i_image> = imageUrl.length) {i_image = 0}
var timer = setTimeout ("showImage ()", 2000)
}
}
fungsi hideimage () {
if (i_strngth> =-10) {
testimage.innerHtml = "<img style = 'filter: alpha (opacity ="+i_strngth+")' src ="+imageUrl [i_image]+"border = 0>";
i_strngth = i_strngth-10
var timer = setTimeout ("hideimage ()", 100)
}
kalau tidak {
ClearTimeout (timer)
i_image ++
if (i_image> = imageUrl.length) {i_image = 0}
i_strngth = 1
var timer = setTimeout ("showImage ()", 500)
}
}
//->
</script>
</head>
<body>
<!-2. Ubah pernyataan <body> menjadi:->
<body onload = "showImage ()">
<!-3. Tambahkan kode berikut ke <body> </body> Heml: Top: 120px; Kiri: 240px dapat mengatur posisi tampilan->
<div id = "testimage" style = "Posisi: absolute; visibilitas: terlihat; atas: 120px; kiri: 240px"> </div>
</body>
</html>
Saya harap artikel ini akan membantu pemrograman JavaScript semua orang.