| Autor | Zpráva | ||
|---|---|---|---|
| Coll22 Profil * |
#1 · Zasláno: 31. 7. 2011, 01:34:56
Ahoj, jak řešíte nejlépe obrázek jako odkaz s hover efektem?
Je tohle dobré řešení? CSS
a{display:block;width:100px;height:100px;background-image:url('neco.jpg');}
a:hover{display:block;width:100px;height:100px;background-image:url('neco.jpg');background-position: -100px 0;}
HTML <a href="odkaz.html"></a> Jde mi o to, že nechci aby tam bylo zpozdeni v dusledku načítání hover obrázku, můj příklad to eliminuje, ale zase je mezi <a href></a> mrtvo, jestli to je validni. Eventuelne, jak to řešíte vy? Klidně za pomocí JS, ale bez zpozdění. Diky |
||
| Bubák Profil |
#2 · Zasláno: 31. 7. 2011, 02:49:44
Tvůj kód jde zkrátit, při hoveru stačí deklarovat změny:
a{display:block;width:100px;height:100px;background-image:url('neco.jpg');}
a:hover{background-position: -100px 0;}Coll22: „ale zase je mezi <a href></a> mrtvo, jestli to je validni.“ To sis mohl zjistit sám: http://validator.webylon.info/check?uri=save:06F8CAC4D1BCCD2DEC00464DA2B746D9&ss=1 Validní to je, ale z hlediska přístupnosti to není žádná sláva, jak při vypnutých obrázcích, ale zejména při vypnutých stylech. Koukni zatím na http://teststranek.kvalitne.cz/#menu a vím o tom, že některé věci by šly udělat lépe. Obrázek jde měnit i změnou text-indent http://diskuse.jakpsatweb.cz/?action=vthread&forum=3&topic=39934 http://diskuse.jakpsatweb.cz/?action=vthread&forum=4&topic=62224 |
||
|
Časová prodleva: 13 let
|
|||
0