Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Zmieniający się obraz (head)
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
omegaca
28.07.2009, 11:42:24
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"
erix
28.07.2009, 11:49:24
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
28.07.2009, 11:54:18
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
28.07.2009, 12:39:46
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?
muniekw
28.07.2009, 12:56:34
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
omegaca
28.07.2009, 15:23:37
nie bardzo wiem jak to zrobić;/.ten obrazek wczytuje tylko przez plik CSS
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.