Rumah > hujung hadapan web > tutorial js > js untuk melaksanakan penukaran rawak imej latar belakang pada halaman web kemahiran javascript

js untuk melaksanakan penukaran rawak imej latar belakang pada halaman web kemahiran javascript

WBOY
Lepaskan: 2016-05-16 16:32:20
asal
2311 orang telah melayarinya

Contoh dalam artikel ini menerangkan cara melaksanakan penukaran rawak imej latar belakang pada halaman web menggunakan js. Kongsikan dengan semua orang untuk rujukan anda. Kaedah pelaksanaan khusus adalah seperti berikut:

Pertama sekali, sediakan beberapa imej Saiz imej (sama ada saiz atau saiz data) mesti dikawal dengan baik Jika terlalu besar, pengguna tidak akan dapat menunggu untuk melihat imej penuh melompat keluar. Jika ia terlalu kecil, ia akan menjejaskan kualiti halaman

Kompilasikan imej ini ke dalam tatasusunan dalam skrip untuk memudahkan panggilan. Panjang tatasusunan sudah tentu bilangan imej.

Salin kod Kod adalah seperti berikut:
var bodyBgs = []; //Buat pembolehubah tatasusunan untuk menyimpan laluan Imej latar belakang
bodyBgs[0] = "images/01.jpg";
bodyBgs[1] = "images/02.jpg";
bodyBgs[2] = "images/03.jpg";
bodyBgs[3] = "images/04.jpg";
bodyBgs[4] = "images/05.jpg";

Oleh kerana 5 imej telah digunakan di atas, nombor rawak dari 0 hingga 4 perlu dijana di sini. Jika panjang tatasusunan berbeza, cuma ubah suai pengganda dalam kod di bawah.

Salin kod Kod adalah seperti berikut:
var randomBgIndex = Math.round( Math.random() * 4 ) ;

Ini adalah program teras. Walaupun ia sangat mudah, ia adalah idea kecil Jika berdasarkan ini, beberapa fungsi lanjutan boleh dibuat melalui pemprosesan. Contohnya: penukaran tema dan persembahan rawak lain, dsb. Di bawah ialah kod JS yang lengkap.

Salin kod Kod adalah seperti berikut:
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan