Jak dynamicznie zmieniać tło w witrynie

Korzystając z CSS i JavaScript, możesz dynamicznie zmieniać tło w swojej witrynie. Za pomocą tego kodu można zmienić tło za każdym razem, gdy użytkownik ładuje stronę internetową do przeglądarki, a kod działa również, jeśli użytkownik odświeży stronę w oknie przeglądarki. Musisz mieć obrazy użyte w twoim tle przesłane na twój serwer, aby wyświetlały się poprawnie w przeglądarce.

1.

Kliknij prawym przyciskiem myszy stronę HTML, którą chcesz edytować, i wybierz "Otwórz za pomocą". Kliknij swój edytor HTML na liście programów.

2.

Załaduj każdy obraz do tablicy JavaScript. Na przykład poniższy kod tworzy tablicę dwóch obrazów na serwerze hosta WWW:

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

3.

Wygeneruj losową liczbę. Losowa liczba jest używana do losowego pobrania obrazu z tablicy. W tym przykładzie załadowane są dwa obrazy, więc musisz wygenerować liczbę z zakresu od 0 do 1. Poniższy kod generuje liczbę losową:

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

4.

Wyświetl obraz tła z tablicy. Poniższy kod łączy tablicę obrazów i losową liczbę, aby wyświetlić losowy obraz jako tło witryny:

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