Autor | Zpráva | ||
---|---|---|---|
jefitto44 Profil |
#1 · Zasláno: 7. 5. 2014, 07:23:56
Mám štandardný obrázok <img> vložený do stránky. Potrebujem, aby keď na neho ukážem myšou, aby sa zmenil na iný obrázok (tzv. hover verzia obrázka). Ako sa to dá docieliť? Poprosím nejaký kód, alebo odkaz, nakoľko v js sa nevyznám absolútne vobec
|
||
Bubák Profil |
Pokud neumíš JS, udělej to pomocí CSS.
Ještě dodám, pokud trváš na JS řešení, koukni na www.jpw.cz, tam je řešení k nalezení. |
||
Taps Profil |
#3 · Zasláno: 7. 5. 2014, 07:54:36
jefitto44:
http://jecas.cz/universalni-hover |
||
jefitto44 Profil |
#4 · Zasláno: 7. 5. 2014, 08:00:09
Ako sa to pomoci css dá? Jedine tak, že by som to dal na pozadie... tomu som sa ale chcel vyhnúť
|
||
Joker Profil |
#5 · Zasláno: 7. 5. 2014, 08:01:56
jefitto44:
„Jedine tak, že by som to dal na pozadie... tomu som sa ale chcel vyhnúť“ Proč? |
||
Bubák Profil |
#6 · Zasláno: 7. 5. 2014, 08:46:31
http://kod.djpw.cz/ubdb
Na odkazech a po přidání třídy pro obrázek to chodí i v IE6 a možná i v IE5/IE5.5. http://kod.djpw.cz/vbdb Jsou i další možnosti, třebas měnit obrázek změnou text-indent Měnící se obrázek po najetí myši |
||
jefitto44 Profil |
#7 · Zasláno: 7. 5. 2014, 09:00:10
Jj vyriešené pomocou
Záměna obrázku při kliknutí |
||
Bubák Profil |
#8 · Zasláno: 7. 5. 2014, 09:09:32
Tak to jsi mohl napsat hned, že hledáš Záměna obrázku při kliknutí a nemotat do toho hover.
|
||
jefitto44 Profil |
#9 · Zasláno: 7. 5. 2014, 09:54:34
Práveže delám zámenu obrázku pri hoveri... ale našiel som len pri kliknutí, tak som si to prerobil. Výsledný kod vyzerá nejako tako
<img src="images/wrapper/ban1.png" alt="" name="ban1" onmouseover="document.images['ban1'].src='images/wrapper/ban1hover.jpg'" onmouseout="document.images['ban1'].src='images/wrapper/ban1.png'"> |
||
Joker Profil |
#10 · Zasláno: 7. 5. 2014, 10:02:22
jefitto44:
V daném případě by stačilo použít jen this.src (je to pak i jednodušší, pokud se do kódu vkládá více obrázků přes kopírovat-vložit). Nevýhoda tohoto přístupu je, že hover obrázek se začne načítat až po najetí myší, takže před prvním zobrazením může být nějaká prodleva. |
||
Bubák Profil |
#11 · Zasláno: 7. 5. 2014, 12:22:07
Nějak takto: Preload obrázku
Ve článku je ukázka JS hoveru <img> včetně preloadu. |
||
Časová prodleva: 10 let
|
0