Autor | Zpráva | ||
---|---|---|---|
Huppicek Profil |
#1 · Zasláno: 8. 10. 2015, 18:29:58
Zdravím, dělám menu s obrázky a každý button má svůj obrázek. Bohužel když chci poté změnit obrázek pomocí hoveru, tak se mi obrázek dává za pozadí prvního obrázku, ale já ho potřebuji dát jako první vrstvu. Děkuji za vaše návrhy.
HTML <li><a href="#" title=""><img src="images/obrazek1.png" alt="#" class="obrazek1"></a></li> CSS img.obrazek1:hover { background-image: url(images/obrazek2.jpg) ; } |
||
Chamurappi Profil |
#2 · Zasláno: 8. 10. 2015, 18:32:42
Reaguji na Huppicka:
Možnosti jsou cca dvě: 1) Nepoužívat <img> a dát i ten první obrázek na pozadí odkazu, ten pak půjde vyměnit při :hover u.
2) Měnit src při přejetí myší pomocí JavaScriptu.
|
||
Huppicek Profil |
#3 · Zasláno: 8. 10. 2015, 18:36:08
Chamurappi:
Která je podle vás lepší ?. První možnost jsem zkoušel, ale když dám na pozadí odkazu, tak v odkazu musím mít něco napsaného, aby se obrázek zobrazil, jenže já tam žádné texty mít nechci, protože je už mám v tom obrázku. |
||
Chamurappi Profil |
#4 · Zasláno: 8. 10. 2015, 18:43:30
Reaguji na Huppicka:
Já bych asi zvolil první možnost. Odkazu musíš nastavit rozměry (rozměry obrázku znáš, ne?) a k tomu musí být blokový. Krom toho mít v odkazu i nějaký text (třeba odpozicovaný do neviditelných končin) není špatný nápad, protože minimálně roboti vyhledávačů a hlasové čtečky nevidomých zatím neumějí číst texty z obrázků. „já tam žádné texty mít nechci, protože je už mám v tom obrázku“ Opravdu to musí být obrázek? Jak vypadá? |
||
Huppicek Profil |
#5 · Zasláno: 8. 10. 2015, 18:46:21
Chamurappi:
V tom prvním obrázku mám právě obrázek bez textu a když potom najede někdo myší, tak se zobrazí obrázek a pod ním text o jakou stránku se jedná. |
||
Huppicek Profil |
#6 · Zasláno: 9. 10. 2015, 16:38:52
Chamurappi:
Tak jsem to nakonec udělal podle první volby, ale ještě bych potřeboval, že když klikne na zvolenou stránku a ta se otevře, tak aby byl otevřený ten obrázek hoveru. Jediná možnost která mě napadá je tam dát prostě image, ale to zase bude bránit vyhledávačům ? |
||
Tomáš123 Profil |
#7 · Zasláno: 9. 10. 2015, 17:03:42
Huppicek:
Aktívnej položke priradíš triedu, ktorej potom obrázok nastavíš. Konkrétnejší selektor zaistí správne zobrazenie. |
||
Huppicek Profil |
#8 · Zasláno: 9. 10. 2015, 19:10:33
Tomáš123:
Jenže já už u nich mám třídy, pro ty hovery -_- |
||
Trejpa Profil |
#9 · Zasláno: 9. 10. 2015, 19:45:07
Huppicek:
Můžeš použít třídu na LI nebo A , můžeš požít i více tříd.
<li class=aktivni><a class=obrazek1></a></li> li.aktivni a.obrazek1 { } <li><a class="obrazek1 aktivni"></a></li> a.obrazek1.aktivni { } |
||
Bubák Profil |
#10 · Zasláno: 10. 10. 2015, 00:18:35
Chamurappi:
„Možnosti jsou cca dvě:“ Ani třetí možnost není špatná, měnit viditelnost obrázku změnou visibility nebo opacity, to jsem se inspiroval jsem se na Webylonu ;-) |
||
Časová prodleva: 9 let
|
0