Cách thay đổi nền một cách linh hoạt trong một trang web

Sử dụng CSS và JavaScript, bạn có thể tự động thay đổi nền trên trang web của mình. Bạn sử dụng mã để thay đổi nền mỗi khi người dùng tải trang web vào trình duyệt và mã cũng hoạt động nếu người dùng làm mới trang web trong cửa sổ trình duyệt. Bạn phải có hình ảnh được sử dụng trong nền của bạn được tải lên máy chủ của bạn, để chúng hiển thị đúng trong trình duyệt.

1.

Nhấp chuột phải vào trang HTML bạn muốn chỉnh sửa và chọn "Mở bằng". Nhấp vào trình soạn thảo HTML của bạn trong danh sách các chương trình.

2.

Tải mỗi hình ảnh vào một mảng JavaScript. Chẳng hạn, đoạn mã sau tạo một mảng gồm hai hình ảnh trên máy chủ lưu trữ Web:

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

3.

Tạo một số ngẫu nhiên. Số ngẫu nhiên được sử dụng để lấy ngẫu nhiên một hình ảnh từ mảng. Trong ví dụ này, hai hình ảnh được tải, do đó bạn phải tạo một số trong khoảng từ 0 đến 1. Đoạn mã sau tạo một số ngẫu nhiên:

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

4.

Hiển thị hình ảnh nền từ mảng. Đoạn mã sau kết hợp mảng hình ảnh và số ngẫu nhiên để hiển thị hình ảnh ngẫu nhiên làm nền trang web:

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