| Autor | Zpráva | ||
|---|---|---|---|
| Skokan Profil |
Ahoj,
řeším problém. Mám tabulku 16x13 a chtěl bych, aby se při přejíždění nad tabulkou zobrazovali aktuální "souřadnice", repesktive horní buňka v aktuálním sloupci a krajní buňka v aktuálním řádku by byla zvýrazněna. Chtěl jsem to udělat tak, že při načtení dokumentu je každému elementu td přiřazena událost onmouseover a onmouseout, ale narazil jsem na problém, jak správně odkazovat na příslušnou buňku v záhlaví, resp. na kraji. Udělal jsem si seznamy s id buněk v záhlaví a chtěl porblém vyřešit viz níže. var radek = ['one','two', 'three','four','five','six','seven','eight','nine','ten','eleven','twelve','thirteen','fourteen','fiveteen']
var sloupec = ['uno', 'duo', 'tres', 'quatro', 'quinto', 'sex','septem', 'octo','novem','decim', 'undecim', 'dudecim']
window.onload = function(){
var anchors = document.getElementsByTagName('tr');
for(var i = 0; i < anchors.length; i++) {
var tds = anchors[i].getElementsByTagName('td');
for(var y = 0; y < tds.length; y++) {
var td = tds[y];
td.onmouseover = function(){
document.getElementById(sloupec[i]).style.background="black";
document.getElementById(radek[y]).style.background="black";
}
td.onmouseout = function(){
document.getElementById(sloupec[i]).style.background="white";
document.getElementById(radek[y]).style.background="white";
}
}
}
}Samozřejmě bych onmouseover a onmouseout mohl vypsat i ke každé buňce tabulky, vždy se správným id, ale radši bych to udělal nějak jednodušeji. Za jakoukoliv pomoc předem dík. Pro jistotu ještě přidám samotnou tabulku. <table>
<tr>
<th></th><th id="one">A</th><th id="two">B</th><th id="three">C</th><th id="four">D</th><th id="five">E</th><th id="six">F</th><th id="seven">G</th><th id="eight">H</th><th id="nine">CH</th><th id="ten">I</th><th id="eleven">J</th><th id="twelve">K</th><th id="thirteen">L</th><th id="fourteen">M</th><th id="fiveteen"N</th>
</tr>
<tr>
<th id="uno">1</th><td onMouseOver="getElementById('one').style.background='black'" onMouseOut="getElementById('one').style.background='white'"></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<th id="duo">2</th><td onMouseOver="getElementById('one').style.background='black'" onMouseOut="getElementById('one').style.background='white'"></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<th id="tres">3</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<th id="quatro">4</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<th id="quinto ">5</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<th id="sex">6</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<th id="septem">7</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<th id="octo">8</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<th id="novem">9</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<th id="decim">10</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<th id="undecim">11</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<th id="dudecim">12</th><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
</table> |
||
| Someone Profil |
#2 · Zasláno: 24. 3. 2013, 22:07:53
Může být?
|
||
|
Časová prodleva: 11 let
|
|||
0