Cara Mengubah Latar Belakang secara Dinamis di Situs Web

Dengan menggunakan CSS dan JavaScript, Anda dapat mengubah latar belakang secara dinamis di situs web Anda. Anda menggunakan kode untuk mengubah latar belakang setiap kali pengguna memuat situs web ke browser, dan kode juga berfungsi jika pengguna me-refresh situs web di jendela browser. Anda harus memiliki gambar yang digunakan di latar belakang Anda diunggah ke server Anda, sehingga mereka ditampilkan dengan benar di browser.

1.

Klik kanan halaman HTML yang ingin Anda edit dan pilih "Open With." Klik editor HTML Anda di daftar program.

2.

Muat setiap gambar ke dalam array JavaScript. Misalnya, kode berikut ini membuat array dua gambar di server host Web:

var background = new Array (); background [0] = "/images/bg1.gif"; background [1] = "/images/bg2.gif";

3.

Hasilkan nomor acak. Nomor acak digunakan untuk secara acak mengambil gambar dari array. Dalam contoh ini, dua gambar dimuat, jadi Anda harus menghasilkan angka antara 0 dan 1. Kode berikut menghasilkan angka acak:

var numberGen = Math.floor (Math.random () * 1)

4.

Tampilkan gambar latar belakang dari array. Kode berikut menggabungkan array gambar dan angka acak untuk menampilkan gambar acak sebagai latar belakang situs web:

document.body.style.background = 'url (' + background [numberGen] + ')';