H@rrY: Tabellenhintergrund dynamisch ändern

Hallo,

gleich noch eine Frage, ich habe es hinbekommen, mit dem folgenden Quelltext EINE Tabellenzelle dynamisch mit JS zu ändern. Mein Qulltext im Syriptbereich sieht so aus:

var a;
function tshandbuch()
  {
  tcolor = test.style.background;
  test.style.background='#FFFFFF';
  }
function tshandbuchout()
  {
  test.style.background = '#003399';
  }

sowie für die Tabellenzelle lautet mein Quelltext:

<td onmouseout="tshandbuch()" onmouseover="tshandbuchout()" id="test"><a href="ts-handbuch.html" target="neues" >TS-Handbuch</a></td>

Dies funktioniert wunderbar! Wenn ich jetzt aber eine zweite Zelle einbinde, also z.B.

var a;
function tshandbuch()
  {
  tcolor = test.style.background;
  test.style.background='#FFFFFF';
  }
function tshandbuchout()
  {
  test.style.background = '#003399';
  }
function schaden()
  {
  tcolor = test.style.background;
  test.style.background='#FFFFFF';
  }
function schadenout()
  {
  test.style.background = '#003399';
  }

im Zellenbereich dann:

<td onmouseout="tshandbuch()" onmouseover="tshandbuchout()" id="test"><a href="ts-handbuch.html" target="neues" >TS-Handbuch</a></td>
<td onmouseout="schaden()" onmouseover="schadenout()" id="test"><a href="schaden.html" target="neues">Schaden</a></td>

Hier klappt es dann leider nicht mehr, da an bestimmten Zeilen ein Objekt erwartet wird. Hat jemand einen Tip für mich, was ich hier falsch gemacht habe?

Danke und Gruß

H@rrY

  1. Hallo,

    test.style.background='#FFFFFF';

    document.getElementById("test").style.backgroundColor="#..."; ist hier angesagt.

    Hier klappt es dann leider nicht mehr, da an bestimmten Zeilen ein Objekt erwartet wird. Hat jemand einen Tip für mich, was ich hier falsch gemacht habe?

    Fuer mehrere Zellen (hier ganze Spalten) hilft vielleicht dieser Hinweis: http://www.styleassistant.de/tips/tip90.htm.

    MfG, Thomas

    1. Fuer mehrere Zellen (hier ganze Spalten) hilft vielleicht dieser Hinweis: http://www.styleassistant.de/tips/tip90.htm.

      Vielen Dank, es klappt!

      Gruß H@rrY

  2. hi

    vielleicht lieg ich falsch, aber ich glaub 2 <tags> dürfen nicht ein und die selbe id haben.

    nen die eine halt test2 (wie kreativ) und übergib die ids an die js-funktion:

    <td id ="test" onmouseout="tshandbuch(test);" onmouseover="tshandbuchout(test);">  
      
    <a href="ts-handbuch.html" target="neues" >TS-Handbuch</a>  
      
    </td>  
      
    <td id="test2" onmouseout="tshandbuch(test2);" onmouseover="tshandbuchout(test);">  
      
    <a href="schaden.html" target="neues">Schaden</a>  
      
    </td>  
    

    dann brauchst du auch nur 2 js-funktionen (soweit die <td>'s die selbe farb-änderung kriegen sollen, sonst musst du die farbe halt auchnoch übergeben). die funktionen müssten dann folgendermaßen aussehen:

    var myid;  
    function tshandbuch(id){  
      myid = id;  
      tcolor = myid.style.background;  
      myid.style.background='#FFFFFF';  
    }  
    function tshandbuchout(id){  
      myid = id;  
      myid.style.background = '#003399';  
    }  
    

    ich habs nicht getestet, vielleicht fehlen irgendwo (z.b. bei der übergabe) noch "gänsefüsschen" oder so, aber so in etwa hab ich das auch schonmal gemacht.

    tschö

    *stefan