potrebuju poradit , v buňce tabulky mam definovane jeji pozadi , v te bunce je text (jen asi do 40% bunky) a ja chci aby se pri najeti na text (je to odkaz) zmenilo pozadi buňky. Driv jsem to delal pomoci CSS filtru mask (v bunce je obrazek , ktery ma filter mask , a pri najeti na nej nema filtr) , ale ten nejak nefungoval v mozille
Jde to pomocí javaskriptu, někde se to tu řešilo, mě to fungovalo v Op, Moz, IE pod Win, ale bez filtru (2 obrázky).
Pozadí jsem musel nastylovat v CSS jako v onmouseout, kvůli spuštění stránky, dále takhle:
IMG:
<td class="backgr" onmouseover="this.style.backgroundImage='url(zmije.jpg)';" onmouseout="this.style.backgroundImage='url(zaba.jpg)';">
<a href="zaba.php">odkaz na zabu</a></td>
COLOR:
<td class="bgcolor" onmouseover="this.style.backgroundColor='#ffffff';" onmouseout="this.style.backgroundColor='#eeeeee';">
<a href="zaba.php">odkaz na zabu</a></td>
Envelope: Filtry jsou výmyslem M$
a jek jde udelat efekt jako je na http://www.web2way.cz ?
Velmi snadno. Odkazům se dá display:block a na a:hover se jim mění barva pozadí.
Inspirace: http://css.maxdesign.com.au/listamatic/index.htm
Jinak, oni tam mají na pozadí ještě obrázek šipečky. Na pravou stranu se dá dát pomocí background-position.
Freya : a jak udělat aby se to pozadí textu měnilo přes celou buňku ? A taky když mám třeba :
<style>
A.text {font-family:verdana;font-size:11px;color:white;text-decoration:none;background-color:black}
A:hover.text{font-family:verdana;font-size:11px;color:black;text-decoration:none;background-color:white}
</style>
<table><tr><td width="100"><a href="nekam.htm" class="text" style="display:block">jedna</a></td></tr>
<tr><td width="100"><a href="nekam.htm" class="text" style="display:block">dvě</a></td></tr>
<tr><td width="100"><a href="nekam.htm" class="text" style="display:block">tři</a></td></tr>
</table>
tak mi jako odkaz bere i pozadí textu co je už za textem jenom u toho prvního , čím to je ?
To odlišné chování u první buňky je problém IE. Chyba není na tvé straně, ale na straně prohlížeče.
V tom selektoru máš myslím chybu, mělo by to být a.text:hover.
Na tabulku se vybodni a udělej to seznamem, takhle:
<ul id="menu">
<li><a href="nekam.htm">jedna</a></li>
<li><a href="nekam.htm">dvě</a></li>
<li><a href="nekam.htm">tři</a></li>
</ul>
<style type="text/css">
#menu {width:100px; margin:0; padding:0;}
#menu li {list-style:none; margin:0.2em 0;}
#menu a {font-family:verdana, arial, sans-serif; font-size:80%; padding:0.2em; color:white; text-decoration:none; background:black; display:block;}
#menu a:hover {color:black; text-decoration:none; background-color:white}
</style>