Změna obrázku

Třeba text-indent.

onmouseover a onmouseout

Jenom nevím, jestli tam bude někdo najíždět myší, když nic neuvidí, nebo je to záměr? Napsal jsem dvě možnosti, jednu z nich smaž, ale zprůsvitnění se mi líbí ;-)
Z kódu Toplistu je tady jen kousek, ale ten pozměněný, odkazu jsem přidal ID.
<style>
/* zmizeni */
a#toplist img {visibility: hidden;}
a#toplist:hover img {visibility: visible;}
a#toplist:hover {visibility: visible;} /* jakakoliv deklarace, jinak to IE nechape*/

/* zprusvitneni */
a#toplist img {filter: alpha(opacity=20); opacity:0.2; }
a#toplist:hover img {filter: alpha(opacity=100); opacity:1;}
a#toplist:hover {visibility: visible;} /* jakakoliv deklarace, jinak to IE nechape*/
</style>

<a id="toplist" href=....

Vždyť text-indent je jen na nastavení odsazení prvního písmene odstavce, jak bych ho tady mohl použít?

Obrázek je také první písmeno odstavce.

Jinak opacitu bych do toho netahal, je pomalá a ne všude podporovaná.

No ten img máš pravděpodobně v nějakém elementu, tipuju <a>.

a {display:block; width:50px; height:30px; overflow:hidden; text-indent:50px;}
a:hover {text-indent:0;}
a img {border:none;}

Takhle nějak by to mohlo fungovat. Šířka odkazu a hodnota text-indent je stejná jako šířka obrázku, douprav si.

Přesněji řečeno, text-indent musí být stejný nebo jakýkoliv větší.

hampy Tak to bohužel taky nefunguje :-( Funguje to v Mozille, ale v IE zase ne

Ale houby, zkoušel jsem to, funguje to všude. Někde máš chybu.

Tak pardon, pro Gecko vlastně musí být ten text-indent záporný.

http://stuff.1-webdesign.cz/text-indent.html funguje všude.

Gecko vlastně musí být ten text-indent záporný.
V čem je problém? Mi to funguje úplně stejně jak s kladnou, tak zápornou hodnotou text-indent. Ve Firefoxu se to chová úplně stejně, jako v IE a Opeře.
Otestoval jsem ve Firefoxu:
Mozilla/5.0 (Windows; U; Windows NT 5.1; cs-CZ; rv:1.7.12) Gecko/20050919 Firefox/1.0.7
Mozilla/5.0 (Windows; U; Windows NT 5.1; cs; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7
Mozilla/5.0 (Windows; U; Windows NT 5.1; cs; rv:1.8.1) Gecko/20061010 Firefox/2.0

V čem je problém?

Mě to ve FF 2.0 s kladným text-indentem nejelo. Mělo by, ale nejelo.

Tohle FF "vezme" s kladným text-indent:
<a id="toplist3" href="#"><img ...

Tohle FF "nevezme" s kladným text-indent:
<a id="toplist3" href="#">
<img ...

Postupně jsem "svůj" kód upravoval přesně do podoby, v jaké ho máš ty. Rozdíly byly tři, rozměry, já jsem mám id="jakesi" a odřádkování kódu.

Jěště dodatek. Použil bych záporný text-indent, protože na odřádkování v kódu se snadno zapomene a kdo pak dá dohromady, že to v gecku po případné úpravě kódu nejede.

Dobry den, mam problem s hlavnym menu. Pri kazdom odkaze v menu mam obrazok, chcel by som aby sa tento obrazok menil ked sa na danu linku postavim mysou. Mam nahrate oba obzrazky no neviem ich takto prepojit. Nieco podobne ako je hore s tym /* zprusvitneni */ no ja chcem aby sa menili obrazky... Prosim napiste mi to tak ako s tym /* zprusvitneni */ polopate, aby som si to tam vedel dat :) DAKUJEM KRASNE :))) JOHN

JOHN
hľadaj v diskusii, alebo si založ novú so svojim problémom, je nevhodné pýtať sa niečo v cudzom vlákne...

Navíc přímo v tomto threadu je to vyřešeno. Dělá se to záporným text-indentem, třeba. Samozřejmě je také možno použít třeba JS.

habendorf
a:hover s text-indentom?

tiso: ano

Trochu jsem zaktualizoval ten příklad na http://stuff.1-webdesign.cz/text-indent.html

habendorf
...až na to že to čo písal JOHN je niečo iné: 2 obrázky vs. 1, a "Pri kazdom odkaze v menu mam obrazok" ešte neznamená čisto obrázkové menu...
Inak: OK...

Tak pokud je tím myšlena nějaká jakoby odrážka nebo obrázek u textu, tak potom background.

Prepacte, ja som naozaj nevedal, ze si treba zalozit diskusiu...naozaj som nechcel...