Zmieniający się obraz (head), CSS,zmiana głownego obrazka Opcje

[omegaca]

Strona HTML+CSS ,
Chodzi mi o to aby główny obrazek na stronie ,który zapisany jest w arkuszu stylów zmieniał się z każdym odświeżeniem strony ,to znaczy np.wchodze na strone wyświetla mi się normlana strona z obrazkiem 1.jpg ,wciskam odśwież wczytyjue się strona z obrazkiem 2.jpg itd.obrazki są tej samej wielkości,chodzi o obraz zaraz nad menu główny obraz na stronie .Obraz zapisany jest w arkuszu stylów.
Moje pytanie jak to zrobić?gdyby ten obrazek był zapisany normalnie w html to użył bym aplikacja javascript losującej ale w arkuszu stylów nie wiem jak to zrobić.Żeby jak ktoś wchodzi na strone to ,żeby zawsze nie był ten sam obraz tylko losował się z "puli"

Ten post edytował omegaca 28.07.2009, 11:43:45

[erix]

W grę wchodzi tylko JS, ostatecznie możesz w PHP zmieniać klasę dla warstwy.

Jeśli chodzi o JS, to jaki problem zrobić np. coś takiego:

Kod

document.getElementById('idNaglowka').className = 'klasa1';

Losowanie - poczytaj o funkcjach losowych (możesz np. losować numerek na końcu klasy) albo zrób tablicę i z niej wyciągaj wybrany element.

[muniekw]

Myślę, że tablica to dobry pomysł.

Robisz w JS tablice gdzie umieszczasz w niej obrazki, a następnie jednym poleceniem z użyciem np funkcji random() wyświetlasz je na stronie.

[omegaca]

no właśnie mam tak :
1.Kawałek arkusza stylów:

CODE

#header_part{
width:XXXpx;
height:XXXpx;
float:left;
background-image: url(../images/head.jpg);
background-repeat: no-repeat;
padding: XXXpx XXpx 0 0;


}

Chodzi o ten obrazek :
background-image: url(../images/head.jpg);

aby wyświetlał się na zmiane ,losowo :head.jpg,head2.jpg,head3.jpg

no mam skrypt JavaScript

CODE

<script language="JavaScript">

function image() {
};

image = new image();
number = 0;

image[number++] = "<img src='plik1.jpg' border='0'>"
image[number++] = "<img src='plik2.jpg' border='0'>"
image[number++] = "<img src='plik3.jpg' border='0'>"
image[number++] = "<img src='plik4.jpg' border='0'>"

increment = Math.floor(Math.random() * number);

document.write(image[increment]);

</script>

ale jak to połączyć ze sobą?

Obrazek jest wpisany do pliku .css a chyba w nim nie użyje JS?

Ten post edytował omegaca 28.07.2009, 12:40:22

[muniekw]

Jak dla mnie to możesz zrobić DIVa w którym będziesz wyświetlał obrazek pobierany ze skryptu. W skrypcie podajesz przecież ścieżkę do pliku, a w css-ie określasz tylko wysokość i szerokość DIV-a

Ten post edytował muniekw 28.07.2009, 12:57:45

[omegaca]

nie bardzo wiem jak to zrobić;/.ten obrazek wczytuje tylko przez plik CSS