| Autor | Zpráva | ||
|---|---|---|---|
| ondra256 Profil * |
#1 · Zasláno: 3. 2. 2011, 21:52:10
Zdravím!
Vytvářím jednu stránku, která čte pomocí PHP údaje z databáze. Tabulka vypadá svou strukturou takto. Potřeboval bych, aby při najetí myší na konkrétní řádek změnil onen řádek barvu pozadí. Jenže nevím, jak to mám zařídit, v tabulce je totiž použit rowspan a colspan a případný OnMouseOver zabarví jedině část tohoto řádku. Ale já ho potřebuji zabarvit celý, aby se například při najetí myší na tu žlutou část obarvil zbytek řádku. Zkoušel jsem to pomocí OnMouseOver do tagu <tr>, avšak to nefungovalo správně (zde je ukázka chyby). Jak zabarvit prosím celý řádek naráz při najetí myší na jednu buňku v něm? Děkuji! |
||
| ondrej16556 Profil |
#2 · Zasláno: 4. 2. 2011, 22:27:55 · Upravil/a: ondrej16556
Dobrý deň,
upravil som trochu váš zdrojový kód na nasledovný: <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="obr/favicon.gif" rel="icon" type="gif" />
<title>Struktura tabulky</title>
<style>
td {text-align:center}
</style>
<script type="text/javascript">
function colorBack(el,setColor,id)
{
if(id == "1") {
el.style.backgroundColor = setColor;
id1.style.backgroundColor = setColor;
} else if(id == "2") {
el.style.backgroundColor = setColor;
id2.style.backgroundColor = setColor;
} else if(id == "3") {
el.style.backgroundColor = setColor;
id3.style.backgroundColor = setColor;
} else if(id == "4") {
el.style.backgroundColor = setColor;
id4.style.backgroundColor = setColor;
} else if(id == "5") {
el.style.backgroundColor = setColor;
id5.style.backgroundColor = setColor;
} else if(id == "6") {
el.style.backgroundColor = setColor;
id6.style.backgroundColor = setColor;
} else if(id == "7") {
el.style.backgroundColor = setColor;
id7.style.backgroundColor = setColor;
} else if(id == "8") {
el.style.backgroundColor = setColor;
id8.style.backgroundColor = setColor;
} }
function clearBack(el,id)
{
if(id == "1") {
el.style.backgroundColor = '';
id1.style.backgroundColor = '';
} else if(id == "2") {
el.style.backgroundColor = '';
id2.style.backgroundColor = '';
} else if(id == "3") {
el.style.backgroundColor = '';
id3.style.backgroundColor = '';
} else if(id == "4") {
el.style.backgroundColor = '';
id4.style.backgroundColor = '';
} else if(id == "5") {
el.style.backgroundColor = '';
id5.style.backgroundColor = '';
} else if(id == "6") {
el.style.backgroundColor = '';
id6.style.backgroundColor = '';
} else if(id == "7") {
el.style.backgroundColor = '';
id7.style.backgroundColor = '';
} else if(id == "8") {
el.style.backgroundColor = '';
id8.style.backgroundColor = '';
} }
</script>
</head>
<body>
<table border="1" align="center" style="width:944px">
<tr bgcolor="#ebebeb" onmouseover="colorBack(this,'green','1')" onmouseout="clearBack(this,'1');" id="id5"><td rowspan="2" style="background-color:#f7f282"><b>příklad struktury</b></td>
<td>Příklad struktury</td>
<td>Příklad struktury</td>
<td>Příklad struktury</td></tr>
<tr bgcolor="#ebebeb" onmouseover="colorBack(this,'green','5')" onmouseout="clearBack(this,'5');" id="id1"><td style="font-style:italic; text-align:justify; padding:3px 12px" colspan="3">Příklad struktury</td></tr>
<tr bgcolor="#f5f5f5" onmouseover="colorBack(this,'green','2')" onmouseout="clearBack(this,'2');" id="id6"><td rowspan="2" style="background-color:#f7f282"><b>příklad struktury</b></td>
<td>Příklad struktury</td>
<td>Příklad struktury</td>
<td>Příklad struktury</td></tr>
<tr bgcolor="#f5f5f5" onmouseover="colorBack(this,'green','6')" onmouseout="clearBack(this,'6');" id="id2"><td style="font-style:italic; text-align:justify; padding:3px 12px" colspan="3">Příklad struktury</td></tr>
<tr bgcolor="#ebebeb" onmouseover="colorBack(this,'green','3')" onmouseout="clearBack(this,'3');" id="id7"><td rowspan="2" style="background-color:#f7f282"><b>příklad struktury</b></td>
<td>Příklad struktury</td>
<td>Příklad struktury</td>
<td>Příklad struktury</td></tr>
<tr bgcolor="#ebebeb" onmouseover="colorBack(this,'green','7')" onmouseout="clearBack(this,'7');" id="id3"><td style="font-style:italic; text-align:justify; padding:3px 12px" colspan="3">Příklad struktury</td></tr>
<tr bgcolor="#f5f5f5" onmouseover="colorBack(this,'green','4')" onmouseout="clearBack(this,'4');" id="id8"><td rowspan="2" style="background-color:#f7f282"><b>příklad struktury</b></td>
<td>Příklad struktury</td>
<td>Příklad struktury</td>
<td>Příklad struktury</td></tr>
<tr bgcolor="#f5f5f5" onmouseover="colorBack(this,'green','8')" onmouseout="clearBack(this,'8');" id="id4"><td style="font-style:italic; text-align:justify; padding:3px 12px" colspan="3">Příklad struktury</td></tr>
</table>
</body>
</html>Možno by potreboval trochu upraviť, no dúfam, že som vám aspoň tým pomohol. |
||
| ondra256 Profil * |
#3 · Zasláno: 5. 2. 2011, 13:28:43
ondrej16556:
Jsem Vám velice vděčný! Funguje to excelentně. |
||
|
Časová prodleva: 13 let
|
|||
0