Witam!
Jak zrobić żeby tło komórki tabeli zmieniało kolor po najechaniu myszką?
Z góry dzięki za pomoc!
0
0
w css
td:hover
{
background-color: kolor;
}
zadziała na normalnych przeglądarkach, na IE musisz użyć JavaScript
0
Co do JavaScript, to pobaw się zdarzeniami onmouseover i onmouseout + style.backgroundColor ;)
0
możesz do A wstawić DIV na full width / height i ustawić klasę A i A:hover po przecinku za TD i TD:hover, wtedy zadziała na IE, bo IE obsługuje pseudoklasę hover tylko dla linków (bez DIVa głupio wygląda na innych niż IE przeglądarkach)
jak to ma być bez linków to tylko JavaScript zostaje
0
w phpmyadminie masz podświetlanie komórek. zobacz tam kod. ja właśnie z phpmyadmina wziełem podświetlanie bo sam nie potrafiłem zrobić. jak chcesz to moge dać Ci mój kod
0
Adamo napisał(a)
możesz do A wstawić DIV [...]
nie mozesz, A jest elementem liniowym a DIV blokowym
0
Masz cały kodzik. Wstaw do pliku html i zobacz jak działa.
p.s. strona zgodna z w3c ;)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> Podświetlenie tabelki </TITLE>
<META NAME="Author" CONTENT="Darek Zawadzki">
<style type="text/css">
<!--
a:hover
{
color:#ffffff;
text-decoration:none;
}
a:link,a:visited
{
color:#dddddd;
text-decoration:none;
}
body,table,td,th,p,div {
font-family: Verdana,Arial, sans-serif;
font-size: 11px;
font-weight: bold;
color:#dddddd;
}
-->
</style>
<SCRIPT LANGUAGE="JavaScript" type="text/javascript">
function setPointer(theRow, theAction, color, color2)
{
var theCells = theRow.cells;
var rowCellsCnt = theCells.length;
if (theAction == 'over')
{
theCells[0].setAttribute('bgcolor', color2, 0);
}
if (theAction == 'out')
{
theCells[0].setAttribute('bgcolor', color, 0);
}
return true;
}
</SCRIPT>
</HEAD>
<BODY bgcolor="#ffffff">
<TABLE cellpadding="3" cellspacing="0" border="0" width="130" bgcolor="#f8f8f8">
<TR onmouseover="setPointer(this, 'over' ,'#f8f8f8', '#b9b9b9');" onmouseout="setPointer(this, 'out', '#f8f8f8', '#b9b9b9');">
<TD width="130"><a href="">Aktualności</a></TD>
</TR>
<TR onmouseover="setPointer(this, 'over' ,'#f8f8f8', '#b9b9b9');" onmouseout="setPointer(this, 'out', '#f8f8f8', '#b9b9b9');">
<TD width="130"><a href="">Dyrekcja</a></TD>
</TR>
<TR onmouseover="setPointer(this, 'over' ,'#f8f8f8', '#b9b9b9');" onmouseout="setPointer(this, 'out', '#f8f8f8', '#b9b9b9');">
<TD width="130"><a href="">Patron</a></TD>
</TR>
<TR onmouseover="setPointer(this, 'over' ,'#f8f8f8', '#b9b9b9');" onmouseout="setPointer(this, 'out', '#f8f8f8', '#b9b9b9');">
<TD width="130"><a href="">Historia</a></TD>
</TR>
</TABLE>
</BODY>
</HTML>
0
To tak apropos standardów W3C jeden mały szczegół - bardziej prawidłowe by było takie Doctype:
<!DOCTYPE HTML PUBLIC "-*W3C*DTD HTML 4.01 Transitional*EN" "http:*www.w3.org/TR/html4/loose.dtd">4.0 nie powinno się stosować, 4.01 jest obowiązujące, ale nie powinno siępisać w skróconej formie (bez ścieżki do DTD), bo Internet Explorer wtedy ląduje w Quirks Mode i mogą dziać sie cuda na stronach.
0
ssnake napisał(a)
Adamo napisał(a)
możesz do A wstawić DIV [...]
nie mozesz, A jest elementem liniowym a DIV blokowym
A w czym leży problem,żeby to zmienić:
a {
display:block;
}
Przykład jak uzyłem tego w menu gurnym:
www.deutsch-menos.com
0
maniek_2 napisał(a)
Przykład jak uzyłem tego w menu gurnym:
www.deutsch-menos.com
Tutaj sytuacja jest drastycznie inna. NIE MASZ div'a w a, zaś zmiana sposobu wyświetlania nie wpływa na to, że W3C zabrania wstawiania elementów Z ZAŁOŻENIA blokowych do elementów Z ZAŁOŻENIA liniowych. Choćby dlatego, że walidacja HTML'a nie bierze pod uwagę styli.
0
czuje się niezauważony. napisałem kod o który autor prosił, a dyskusja nadal trwa.. :/
0
Adam.Pilorz napisał(a)
maniek_2 napisał(a)
Przykład jak uzyłem tego w menu gurnym:
www.deutsch-menos.comTutaj sytuacja jest drastycznie inna. NIE MASZ div'a w a, zaś zmiana sposobu wyświetlania nie wpływa na to, że W3C zabrania wstawiania elementów Z ZAŁOŻENIA blokowych do elementów Z ZAŁOŻENIA liniowych. Choćby dlatego, że walidacja HTML'a nie bierze pod uwagę styli.
Te warning'i na pewno nie dotyczą zmiany na element blokowy.
0
@Zawadzki14: Napisałeś odpowiedź, ale to nie zmienia faktu, że po pierwsze nie idealną (Ktos przyczepił się do DOCTYPE), a po drugie w temacie pojawiły się błędne informacje, które należy sprostować.
//Added: @maniek_2: Oczywiście, bo zmiana sposobu wyświetlania na blokowy jest jak najbardziej legalna. Ale wskaż mi w kodzie miejsce, gdzie masz div'a wewnątrz a, tak jak napisałeś wcześniej - nie masz takiego, a jakbyś miał, to validator HTML by zwrócił błąd z tym związany, bo taka konstrukcja, niezależnie od styli css, jest niedozwolona.
0
A oto Ci chodzi. Ja źle zrozumialem post i tak jakbym przeczytal z niezrozumieniem - myslam, ze chodzi, że a nie jest blokowy i nie mozna go zamienic :D :D
0
Zawadzki14 , twój kod zmiany koloru trochę za długi niż potrzeba jest. W funkcji jest chyba jedna niepotrzebna zmienna (rowCellsCnt). Wystarczyłoby przecież zamiast wywoływać funkcję, bezpośrednio w onmouseover/out wpisać kod zamiany klasy lub konkretnego atrybutu ,np. this.cells[0].setAttribute('bgcolor', color, 0);
0
No dobra, można też po prostu dać:
<td onmouseover="this.style.background='red'; return true;" onmouseout="this.style.background='white'; return true;">
0
A przy okazji zapytam się: w jaki sposób zmienić właściwość display diva. Mam diva o id="podmenu" i pobieram go przez document.getElementById('podmenu'). Próbowałem zmienić display przez:
document.getElementById('podmenu').setAttribute('display','block') ale jakoś nie działa (komunikat z konsoli jest taki, że document.getElementById('podmenu') nie ma żadnych właściwości). Podejrzewam, że trzeba się odwołać do jakiegoś innego obiektu, tylko nie wiem jakiego.
0
document.getElementById('podmenu').style.display = 'block';