+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: xHTML, CSS, JavaScript (https://www.webmastertalk.pl/forum-xhtml-css-javascript)
+--- Wątek: Najeżdżanie myszką na obraz (/thread-najezdzanie-myszka-na-obraz)
Najeżdżanie myszką na obraz - Mooe - 21-11-2011
RE: Najeżdżanie myszką na obraz - Kartofelek - 21-11-2011
Robisz sobie listę UL. W każde LI wrzucasz sobie A, które ma w sobie 2 obrazki:
Kod:
<a href="duzy_obrazek.jph">
<span><img src="kolorowy_obrazek.jpg" /></span>
<img src="maly_czarnobialy.jpg" />
</a>i teraz:
Kod:
a {display:block; width:....px; height:....px; position:relative;}
a img {position:absolute; left:0; top:0; z-index:0;}
a span {z-index:1; display:none; position:relative;}
a:hover span {display:block;}Resztę stylowania zostawiam tobie - w końcu nauka jest najważniejsza
Oczywiście możesz też wykorzystać JS, chociaż jak widzisz to nie jest tutaj wymagane.
http://doman.art.pl/kursjs/kurs/obrazki.html
Podana powyżej metoda jest trywialna i ma swoje wady. Osobiście pewnie bym wykorzystał do tego celu canvas, ale to już nie dla ciebie.
RE: Najeżdżanie myszką na obraz - Mooe - 22-11-2011
Okay, okay wszystko tak jak chciałem dzięki !
Tylko jest jeden problem , jak te zdjęcia ustawić w szeregu?
Bo ustawiam na środku to wszystkie zdjęcia są pod sobą a ja chciałbym 3 u góry i 2 na dole.
RE: Najeżdżanie myszką na obraz - Kartofelek - 22-11-2011
float:left dla LI + width i height
albo display:inline-block też dla LI