mouseover mit text
bernd
- javascript
0 Johannes
mouseover effekt mit grafik ist bekannt, ist auch kein prob.
aber das ganze möchte ich nur mit text machen.bisher gelang es mir nicht 100%.
ich habe es über extern css-datei gemacht. das hat aber den nachteil, das tatsächlich immer alles farblich hinterlegt wird, wo ich schon war.der text soll aber nur farblich hinterlegt sein, wenn ich mit der maus drueber fahre und der text der schon mal angeklickt wurde soll auch beim nächsten laden des browsers in den nichtangeklickten zustand sein, also nicht auf die history zurückgreifen.
der text soll in schrifttyp, grösse, farbe etc. frei formatierbar sein. es soll idealerweiser in IE und netscape funzen.
die idealste version für meine zwecke wäre ein problemloser wechsel, mal mit zwei Pix, mal mit zwei text, mal mit pix und text.
mit der text/text und der Pix/text-version möchte ich z.b. platz auf dem server einsparen. statt 60 pix habe ich dann nur text oder nur 30 pix, jenachdem.
vielleicht ist es ja so zu gestalten, das bei der Variate Pix/Text, der text schon im Hintergrund steht und nur vom Pix verdeckt ist.
es ist mir dabei wichtig, das bei den varianten Text/Text und Pix/Text im höchsten fall nur eine neue externe Datei angelegt werden muss.
vielen dank für die hilfe.
bernd
Man hat die Möglichkeit, mit <span> Textabschnitte zu definieren, auf die man die Universalattribute anwenden kann.
Eine Dateiabschnitt, in dem sich der Text blau färbt, wenn man mit der Maus über ihn fährt, wäre z.B.:
<span onMouseOver="this.style.color = '#FFFFFF';" onMouseOut="this.style.color = '#000000';">Hier der Text</span>
Mit Span definiert man einen Textabschnitt, auf den man dann die Event-Handler anwendet. In denen werden hier über JavaScript die Style-Eigenschaften dieses Abschnittes geändert.
Natürlich kann man auch eine Funktion aufrufen, und den textabschnitt über die id ('id="Textabschnitt"' mit in den span-Tag schreiben) editieren. Dies tut man mit z.B. "document.all.Textabschnitt.style.color = '#FFFFFF';".
Den Wechsel zwischen Bildern und Text schafft man mit z.B. einem Event-Handler auf document.all.Textabschnitt.innerHTML = "<img src='grafik.gif'>".
Probleme dass die ganze Datei ihren Hintergrund wechselt, kann man auch umgehen, indem man eine Tabelle mit einer Spalte und einer Reihe definiert, und dann nur die BG-Farbe von <td> editiert (über die ID oder über die class in CSS).
Hallo Bernd,
schau mal unter http://www.dansteinman.com/dynduo/ nach.
Das ist ein ausführliches Tutorial über dynamisches HTML mit JavaScript.
Text rollovers findest du da z. B. unter http://www.dansteinman.com/dynduo/en/changingstyles.html
viele Grüße
ottmar
Hi!
Mit Span definiert man einen Textabschnitt, auf den man dann die Event-Handler anwendet. In denen werden hier über JavaScript die Style-Eigenschaften dieses Abschnittes geändert.
das funktioniert aber nur beim IE.
mfG
Brand