Uschi Renziehausen: Styles dynamisch ändern

Beitrag lesen

Hallo,

onmouseover="document.getElementById('title_sieben').style.alinkColor = '#ff0000';"

Das kann so gar nicht klappen, weil du gar kein a-Element hast, das title_sieben heißt, sondern ein div-Element, das ja keine style-Eigenschaft alinkColor kennt. Also passiert nix. Wenn sich die Farbe vom a ändern soll, muesst ihr das auch ansprechen.

Wenn eure divs wirklich immer so aussehen:
<div id="titel_sieben"><a href="blabla.html">verweistext</a></div>
                       ^
      kein Leerzeichen oder Zeilenumbruch
kommt ihr an das a mit der Eigenschaft firstChild dran.

Anbei Beispielcode:
<html>
  <head>
  <style type="text/css">
  a.off:link, a.off:active, a.off:visited, a.off:hover {color:#ffff00}
  a.on:link, a.on:active, a.on:visited, a.on:hover {color:#ff0000}
  </style>
  </head>
  <body>
  <div id="t7"><a class="off" href="blabla.html">Link</a></div>
  <div   onmouseover="document.getElementById('t7').firstChild.className='on'"
       onmouseout="document.getElementById('t7').firstChild.className='off'">
       an/aus</div>
  </body>
</html>

Es wäre in meinen Augen ratsam, sich dafür eine Funktion zu schreiben, um das ewige document.getElementById() zu sparen.

Liebe Grüße, Uschi