# bei klick farbe ändern



## dennislassiter (29. Dezember 2002)

Hallo,
ich hab ein kleines Problem.
Ich möchte mein Menü auf der Seite http://www.lyrics2003.de anders positonieren. Undzwar dort, wo jetzt ein kleines Beispiel steht (oben im 1. blauen Balken)
Ich möchte, dass Wenn man auf z.B. Songtexte klickt, das diese Zelle in der Tabelle die Farbe <?=$farbe2;?> einnimmt.
Wenn man dann z.B. auf Lyrics2003 klickt, dass dan Songtexte wieder die ursprüngliche Farbe (<?=$farbe1;?>) hat. Und so weiter halt.
Kann mir jemand helfen???

bye
Dennis


----------



## Adam Wille (29. Dezember 2002)

Hoi,

in Browsern, deren JavaScript-Engine die Methode _getElementsByName()_ interpretieren kann, ginge das wie folgt:

```
<script type="text/javascript" language="JavaScript">
<!--

function highlight(high) {
    zellen = document.getElementsByName("menuzelle");
    for (a=0; a<zellen.length; a++) {
        document.getElementsByName("menuzelle")[a].style.backgroundColor="#000000";
        document.getElementsByName("menuzelle")[high].style.backgroundColor="#FF0000";
    }
}

//-->
</script>
```
wäre das entsprechende JavaScript und die Tabelle müsstest du bspw. wie folgt gestalten:

```
<table>
  <tr>
    <td name="menuzelle" onClick="highlight(0)">Klick!</td>
    <td name="menuzelle" onClick="highlight(1)">Klick!</td>
    <td name="menuzelle" onClick="highlight(2)">Klick!</td>
    <td name="menuzelle" onClick="highlight(3)">Klick!</td>
    <td name="menuzelle" onClick="highlight(4)">Klick!</td>
  </tr>
</table>
```
Farben usw. müssten noch angepasst werden...

hth,
Geist


----------



## dennislassiter (29. Dezember 2002)

Mit Netscape 7 (best browser of the world) gehts. Mit IE nicht :-(


----------



## Adam Wille (30. Dezember 2002)

Schrieb ich ja:

Mit Browsern die das DOM insoweit unterstützen, dass die _getElementsByName()_-Methode interpretiert werden kann, klappt das wunderbar, das sind aber nur die der neueren Generation...

Bei Gelegenheit kann ich mal über, sicherlich aufwendigere, Version auch für andere Browser sinnieren. 

Geist


----------



## dennislassiter (30. Dezember 2002)

Wenn man die Beispiele von SELFHTML durchgeht, dann stellt man Fest, das IE das unterstützt.
Aber egal.
Bei SelfHTML hab ich schon eine Antwort auf das Problem bekommen.
Trotzdem vielen Dank, und einen guten Rutsch ins neue Jahr!


----------



## Gumbo (30. Dezember 2002)

Ich hätt's so gelöst, da muss man nicht jeder Zelle einzeln den Befehlt zuweisen, wenn sowieso die ganze Tabelle dies machen soll.


```
<HTML>
  <HEAD>
  <script type="text/javascript" language="javascript">
  function init()
    {
    var table = document.getElementById('hover_table');
    cells = table.getElementsByTagName('td');
    for(i=0; i<cells.length; i++)
      {
      cells[i].onmouseover = hover;
      cells[i].onmouseout = normal;
      }
    }
  function hover()
    {
    event.srcElement.className = "hilighted";
    }
  function normal()
    {
    event.srcElement.className = "";
    }
  </script>
  <style type="text/css">
  TABLE TD.hilighted
    {
    background-color: #f0f0ff;
    cursor: hand;
    }
  </style>
  </HEAD>
  <BODY onload="init()">
  <table id="hover_table">
    <tr>
      <td width="120">1</td><td width="120">2</td>
    </tr>
    <tr>
      <td>1</td><td>2</td>
    </tr>
    <tr>
      <td>1</td><td>2</td>
    </tr>
    <tr>
      <td>1</td><td>2</td>
    </tr>
    <tr>
      <td>1</td><td>2</td>
    </tr>
  </table>
  </BODY>
  </HTML>
```


----------



## Adam Wille (30. Dezember 2002)

Schöner Vorschlag. 

Sieht allerdings an folgender Stelle arg nach JScript statt JavaScript aus, so dass es nur der IE interpretieren wird:

```
cells = table.getElementsByTagName('td'); 
for(i=0; i<cells.length; i++) { 
    cells[i].onmouseover = hover; 
    cells[i].onmouseout = normal; 
}
```
Geist


----------

