nicht angemeldet
Wie Layer Inhalt dynamisch ändern? (Für Mouseover-Hilfe)
Hallo Zusammen,
möchte bei Mausberührung eines Links einen Hilfetext in einem Layer anzeigen. Der Text soll dabei immer übergeben werden.
Zuerst soll es mal im IE tun, der Rest kommmt (vielleicht) später.
Habe es soweit fertig, nur mit der Übergabe des Textes klappt es noch nicht. Eventuelle Lösung:innerHtml? Doch wie ist der Syntax?
Gruß powtac
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head><title>Test</title>
<script language="JScript" type="text/jscript">
<!--
var anzeigen;
function SetText(text)
{
anzeigen = text;
document.all.Springer.insertAdjacentText("AfterBegin", ' '+anzeigen);
}
function SetPos()
{
window.document.all.Springer.style.visibility = "visible";
document.all.Springer.style.left = window.event.x;
document.all.Springer.style.top = window.event.y;
}
function Close()
{
window.document.all.Springer.style.visibility = "hidden";
}
//-->
</script>
</head><body>
<div id="Springer" style="visibility:hidden; position:absolute; width:200px; height:100px; font-size:14pt; background-color:#000066; color:#FFFF00; padding:5px;">
<tt>Layer original Text</tt>
</div>
<span style="color:green" OnMouseOver="SetText('Hilfe zu ersten')" onMouseMove="SetPos()" onMouseOut="Close()">1. Hier mit der Maus drüber!</span><br><br>
<span style="color:green" OnMouseOver="SetText('Hilfe zu zweitens')" onMouseMove="SetPos()" onMouseOut="Close()">2. Hier mit der Maus drüber!</span><br><br>
<span style="color:green" OnMouseOver="SetText('und drittens')" onMouseMove="SetPos()" onMouseOut="Close()">3. Hier mit der Maus drüber!</span>
</body>
</html>
-
Hallo,
vielleicht möchtest Du nach der Lektüre von http://aktuell.de.selfhtml.org/tippstricks/css/infobox/index.htm das ganze nochmal überdenken, anderfalls sehe ich auch keinen Grund das mit JavaScript breitestmöglich browserübergreifend zu realisieren.
Allerdings wäre es dabei hilfreich, wenn Du einwenig mehr aus Dir heraus kommen würdest, als "nur mit der Übergabe des Textes klappt es noch nicht".
Eventuelle Lösung:innerHtml?
Eventuell ja http://de.selfhtml.org/javascript/objekte/all.htm#inner_html aber dann bitte document.getElementById([ID]).innerHTML
Eventuell nein http://de.selfhtml.org/javascript/objekte/node.htmWeiterführendes Beispiel http://www.knopper.net/knoppix/
Gruß aus Berlin!
eddi--
at, wie er leibt und lebt auf ein Posting
> > Nein, ich denke nicht.
gepromptet
> Das empfiehlt sich aber.
:))))-
Weiterführendes Beispiel http://www.knopper.net/knoppix/
Danke! Das Beispiel ist gut genauso wollte ich es.
Weiterführendes wäre es dabei hilfreich, wenn Du einwenig mehr aus Dir heraus kommen würdest, als "nur mit der Übergabe des Textes klappt es noch nicht".
Die Seite die ich mit Hilfstexten versehen möchte wird dynamisch (mit PHP) aufgebaut. Zu jedem Element ist ein Hilfstext vorhanden. Ich weiss aber am Anfang der Seite noch nicht wieviel Elemente und welche Hilfstexte angezeigt werden sollen, deshalb kann ich sie nicht wie im Beispiel alle in ein JS am Seitenanfang schreiben.
Also dachte ich mir, übergib den entsprechenden Text an eine Funktion: "onMouseover:setText('Hilfe zu genau diesem Element')"
function setText() soll nun diesen Text in einem Layer darstellen.
innerHtml wäre eine Lösung aber ich finde den richtigen "node" nicht. Wie kann das <div>-Tag angesprochen werden?
Was kommt nach "document.all.Springer. ... .innerHtml ..." um:
"<div id="Springer"><tt>Layer original Text</tt></div>"
anzusprechen?Gruß powtac
-
Habs geschafft mit innerHtml!
So jetzt habe ich erstmal eine Version für IE...<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head><title>Test</title>
<script language="JScript" type="text/jscript">
<!--
function setHelpText(text)
{
document.all.HelpLayer.innerHTML = text;
document.all.HelpLayer.style.visibility = "visible";
}function setHelpPos()
{
document.all.HelpLayer.style.left = window.event.x;
document.all.HelpLayer.style.top = window.event.y;
}function closeHelp()
{
window.document.all.HelpLayer.style.visibility = "hidden";
}
//-->
</script>
</head><body>
<div id="HelpLayer" style="visibility:hidden; position:absolute; width:200px; height:100px; font-size:14pt; background-color:#000066; color:#FFFF00; padding:5px;">
<tt>Layer original Text</tt>
</div>
<span style="color:green" OnMouseOver="setHelpText('Hilfe zu ersten')" onMouseMove="setHelpPos()" onMouseOut="closeHelp()">1. Hier mit der Maus drüber!</span><br><br>
<span style="color:green" OnMouseOver="setHelpText('Hilfe zu zweitens')" onMouseMove="setHelpPos()" onMouseOut="closeHelp()">2. Hier mit der Maus drüber!</span><br><br>
<span style="color:green" OnMouseOver="setHelpText('und drittens')" onMouseMove="setHelpPos()" onMouseOut="closeHelp()">3. Hier mit der Maus drüber!</span>
</body>
</html>-
Hallo,
So jetzt habe ich erstmal eine Version für IE...
wirklich schade!
document.getElementById("HelpLayer").innerHTML http://de.selfhtml.org/javascript/objekte/document.htm#get_element_by_id
Gruß aus Berlin!
eddi--
at, wie er leibt und lebt auf ein Posting
> > Nein, ich denke nicht.
gepromptet
> Das empfiehlt sich aber.
:))))
-
-
-