IPB

Willkommen, Gast ( Anmelden | Registrierung )

2 Seiten V   1 2 >  
Reply to this topicStart new topic
> Onmouseover-text In Css
Gast_Apeman_*
Beitrag 15.06.2004 - 16:44
Beitrag #1





Gäste






Hallo,

ich habe feststellen müssen, das der Firefox verschiedene Sachen nicht anzeigt, so z.B. einen onMouseover-Textwandel nach diesem Beispiel.

QUELLTEXT
<div id="Test">&nbsp;</div>

<map name="bedienung">
<area shape="circle" coords="60,45,15" title="Green Power" onMouseover="document.all.Test.innerText='Die Green-Power-Taste'" onMouseout="document.all.Test.innerText=''">


Da ich auch nicht unbedingt ein Freund von JavaScript bin, ist meine Frage: Gibt es eine Möglichkeit mittels CSS einen onMouseover- Effekt so hin zukriegen, das sich im HTML-Dokumnet kein Text dynamisch ändert?

Wenn ja, hat jemand eine Idee wie? Bitte ein Beispiel, ich will dazulernen.

Danke sehr
Go to the top of the page
 
+Quote Post
Conny
Beitrag 15.06.2004 - 17:21
Beitrag #2


Kommt Zeit, kommt Rat, kommt Conrad!
Gruppensymbol

Gruppe: Mods
Beiträge: 1.169
Mitglied seit: 21.11.2001
Wohnort: Altenkirchen, Westerwald
Mitglieds-Nr.: 42



Hallo Apeman,
so aus'm Bauch heraus glaube ich nicht, daß das was Du vorhast -anhand Deines Beispieles- geht.
Außer man würde das JS in der CSS Datei verlagern?
Bei Selfhtml habe ich folgendes gefunden, vielleich hilft es Dir weiter.
CSS und Mousover
cu
Conny
Go to the top of the page
 
+Quote Post
Gast_Apeman_*
Beitrag 15.06.2004 - 17:23
Beitrag #3





Gäste






ZITAT(Conny @ 15.06.2004 - 18:21)
Hallo Apeman,
so aus'm Bauch heraus glaube ich nicht, daß das was Du vorhast -anhand Deines Beispieles- geht.
Außer man würde das JS in der CSS Datei verlagern?
Bei Selfhtml habe ich folgendes gefunden, vielleich hilft es Dir weiter.
CSS und Mousover
cu
Conny

Nun, mit dem InternetExplorer geht das, aber der zeigt auch alles an sad.gif

Aber danke für deinen Link, werds mal lesen und ausprobieren.
Go to the top of the page
 
+Quote Post
Gast_Apeman_*
Beitrag 15.06.2004 - 17:29
Beitrag #4





Gäste






Nachtrag: Also, das Beispiel von dir ersetzt eine Grafik durch eine andere beim Mouseover. Ich habe allerdings eine MAP-Grafik, in Links aufgeteilt und beim Mouseover soll an einer frei definierbaren Stelle im HTML-Dokumnet ein Text eingeblendet werden, ähnlich dem "alt" oder "title"-Tag. Mit Grafiken habe ich das schon hinbekommen, aber nicht mit Text. Auch mit "innerHTML" bin ich bisher gescheitert, zeigt Firefox auch nicht an.

Kennt jemand eine Browserübergreifende Lösung?

Der Beitrag wurde von Apeman bearbeitet: 15.06.2004 - 17:30
Go to the top of the page
 
+Quote Post
Gast_heinzelhund_*
Beitrag 15.06.2004 - 19:14
Beitrag #5





Gäste






Hallo,

ein offensichtliches Problem in deinem Script ist 'document.all'. Hierbei handelt es sich um eine DHTML-Konvention von MS. Wird in der Gecko-Engine nicht interpretiert, da nicht W3C-konform.

Mit 'document.getElementById() ' kannst du zunächst deine Elemente ansprechen. Wird interpretiert vom IE5+, Moz, NS 6+, Opera etc..

Ferner dürfte 'innerText' nicht W3C-konform sein. Hier könntest du mit 'Textknoten' arbeiten. Funktioniert in den oben genannten Browsern.

Siehe W3C DOM2-Model
selfHTML: nodes

Ciao
Heinzelhund

Der Beitrag wurde von heinzelhund bearbeitet: 15.06.2004 - 19:15
Go to the top of the page
 
+Quote Post
Gast_Apeman_*
Beitrag 15.06.2004 - 21:02
Beitrag #6





Gäste






Danke für deine Mühe. Habe zwar den Wälzer von Münz/Nefzger vor mir zu liegen, finde dort "nodes" aber nicht. Wahrscheinlich schon zu alt. Werde mir deine Ratschläge ansehen.

Danke
Go to the top of the page
 
+Quote Post
Gast_Apeman_*
Beitrag 15.06.2004 - 22:41
Beitrag #7





Gäste






Man, ist das eine Materie!
Also, für die es auch wissen möchten ich habe es geschafft, DANK eurer Hilfe und Denkansätzen.
Und so funktioniert es (Beispiel):

QUELLTEXT
<div id="Absatz">Hier wird ein Text ausgegeben, der dynamisch geändert wird.</div>

<map name="Bild">
<area shape="circle" coords="60,45,15" title="Power" onMouseover="document.getElementById('Absatz').firstChild.nodeValue='Die Power-Taste zum ein- bzw. ausschalten der Anlage.'" onMouseout="document.getElementById('Absatz').firstChild.nodeValue=''">
...weitere <area's>
<img usemap="#Bild" align="left" src="pfad/zur/Grafik" width="200" height="560" border="0" alt="Die Bedienelemente">
</map>


Mittel CSS habe ich noch die Position, Schriftart, Farbe etc. des DIV-Containers bestimmt.
Der Effekt ist: Die Grafik ist das Bild einer Konsole und wird als MAP eingebunden und angezeigt. Beim darüberfahren mit der Maus über die verschiedenen Bedienknöpfe der Konsole wird ein Text im DIV-Container als Erläuterung angezeigt, ähnlich dem alt- bzw. title-Tag. Nicht spektakulär, aber genau was ich brauchte und es funktioniert mit IE und Firefox. Andere Browser habe ich nicht.

Danke icon13.gif
Go to the top of the page
 
+Quote Post
Gast_heinzelhund_*
Beitrag 15.06.2004 - 23:40
Beitrag #8





Gäste






Glückwunsch, ich hab für das Thema länger gebraucht. laugh.gif icon13.gif laugh.gif
Tipp zum Thema am Rande: Gecko interpretiert auch einen Zeilenumbruch im Quelltext als einen Knotenpunkt.

Ciao
Heinzelhund
Go to the top of the page
 
+Quote Post
Gast_Apeman_*
Beitrag 16.06.2004 - 0:03
Beitrag #9





Gäste






Danke für den Glückwunsch und auch für den Tipp!

Ich musste mir allerding SelfHTML 8 herunter laden. Mein Buch mit SelfHTML 7.0 ist doch schon etwas betagt, habe ich festgestellt. Die Änderungen sind im Detail schon enorm.
Go to the top of the page
 
+Quote Post
Auge
Beitrag 16.06.2004 - 1:19
Beitrag #10


Anwärter auf W3.org Mitgliedschaft
*****

Gruppe: User
Beiträge: 550
Mitglied seit: 28.11.2001
Wohnort: Berlin Friedrichshain
Mitglieds-Nr.: 107



ZITAT(Apeman @ 16.06.2004 - 1:03)
Ich musste mir allerding SelfHTML 8 herunter laden. Mein Buch mit SelfHTML 7.0 ist doch schon etwas betagt, habe ich festgestellt. Die Änderungen sind im Detail schon enorm.

Hallo

Das fällt dir jetzt auf, wo SelfHTML 8 auch schon ca. 2,5 Jahre alt ist, und viele,
wegen der neueren Browser, nach einer neuen Version der Doku rufen. wink.gif

*btw*: Auf den SelfHTML-Seiten gibt es auch Beschreibungen, wie man die
verschiedenen Arten der verschiedenen Browser, auf JavaScript zuzugreifen,
kontrollieren kann (Feature Artikel, Tips und Tricks, Suche).

Sollte mit den neuen Servern jetzt auch rund um die Uhr funktionieren (namentlich die Suche).

Tschö, Auge
Go to the top of the page
 
+Quote Post
Google Bot
Beitrag
Beitrag #


Google Ads









Go to the top of the page
 
Quote Post

2 Seiten V   1 2 >
Reply to this topicStart new topic
1 Besucher lesen dieses Thema (Gäste: 1 | Anonyme Besucher: 0)
0 Mitglieder:

 



RSS Vereinfachte Darstellung Aktuelles Datum: 28.03.2024 - 17:30

taschenkalender
expertise-panel IPS Driver Error

IPS Driver Error

There appears to be an error with the database.
You can try to refresh the page by clicking here