Link im Naviframe aus Zielframe heraus ändern
Heinz
- javascript
Hallo Leute,
ich stehe vor folgendem Problem: Ich habe einen Navigationsframe und einen Inhaltsframe. Der Naviframe ist nach folgendem Schema aufgebaut:
<a href="main.htm" target="mainFrame" onFocus="if(this.blur)this.blur()">
<a href="test.htm" target="mainFrame" onFocus="if(this.blur)this.blur()">
<a href="huhu.htm" target="mainFrame" onFocus="if(this.blur)this.blur()">
usw.
Im Style steht u.a. folgendes:
a:hover { text-decoration:none; color:#ffffff; background-color:#aaaaff; }
a:active { text-decoration:none; color:#ffffff; background-color:#0000ff; }
So weit, so gut.
Die Funktion onFocus="if(this.blur)this.blur()" ist eigentlich dazu da, um den hässlichen Linkrahmen zu elimieren. Beisst sich aber natürlich mit a:active, weil die "Aktivität" des Links ja quasi sofort wieder ausgeschaltet wird.
Meine Idee ist es, den Link aus der HTML-Datei, welche durch Anklicken des Links ins Zielfenster geladen wird, per JavaScript zu aktivieren. Das hätte auch den enormen Vorteil, daß man mit den Browser-Buttons "Vor" und "Zurück" arbeiten kann und immer der "richtige" Link entsprechend eingefärbt wird.
Gibt es da eine Lösung? Bin für jede Hilfe dankbar.
Gruß, Heinz
Hi,
Die Funktion onFocus="if(this.blur)this.blur()" ist eigentlich dazu da, um den hässlichen Linkrahmen zu elimieren. Beisst sich aber natürlich mit a:active, weil die "Aktivität" des Links ja quasi sofort wieder ausgeschaltet wird.
Gibt es da eine Lösung? Bin für jede Hilfe dankbar.
Via parent und und frames kann man beliebig andere frames ansprechen. SELFHTML sollte hierzu verständliche Beispiele haben ...
Gruß, Cybaer
Danke für die Antworten.
Habe den Code nun noch mal umgefummelt. Nun sieht es im Menüframe so aus:
JS:
function hove(e) {
if (document.getElementsByTagName("a")[e].style.backgroundColor != "#0000ff")
{
document.getElementsByTagName("a")[e].style.backgroundColor = "#aaaaff";
document.getElementsByTagName("a")[e].style.color = "#ffffff";
}
}
function norm(e) {
if (document.getElementsByTagName("a")[e].style.backgroundColor != "#0000ff")
{
document.getElementsByTagName("a")[e].style.backgroundColor = "#ffffff";
document.getElementsByTagName("a")[e].style.color = "#000000";
}
}
BODY:
<a href="main.htm" onmouseover="hove(0)" onmouseout="norm(0)" onFocus="if(this.blur)this.blur()" id="main" target="mainFrame">Startseite</a>
<a href="testlink1.htm" onmouseover="hove(1)" onmouseout="norm(1)" onFocus="if(this.blur)this.blur()" id="testlink1" target="mainFrame">testlink</a>
<a href="testlink2.htm" onmouseover="hove(2)" onmouseout="norm(2)" onFocus="if(this.blur)this.blur()" id="testlink2" target="mainFrame">testlink2<a>
usw.
Im Inhaltsframe (hier z.b. in testlink1.htm) steht dann als JS:
for (var hd = 0; hd < parent.topFrame.document.getElementsByTagName("a").length; hd++) {
parent.topFrame.document.getElementsByTagName("a")[hd].style.backgroundColor = "#ffffff";
parent.topFrame.document.getElementsByTagName("a")[hd].style.color = "#000000";
}
parent.topFrame.document.getElementById("testlink1").style.color = "#ffffff";
parent.topFrame.document.getElementById("testlink1").style.backgroundColor = "#0000ff";
Das funktioniert im IE auch ganz prächtig. Allerdings in Mozilla nicht. Die Abfrage im Menüframe
if (document.getElementsByTagName("a")[e].style.backgroundColor != "#0000ff")
scheint Mozilla komplett zu ignorieren.
Was mach ich denn nun schon wieder falsch?
Sorry, bin ein Newbie und hab fast keine Haare mehr zum raufen :-)
Gruß,
Heinz
Hi,
Das funktioniert im IE auch ganz prächtig. Allerdings in Mozilla nicht. Die Abfrage im Menüframe
if (document.getElementsByTagName("a")[e].style.backgroundColor != "#0000ff")
scheint Mozilla komplett zu ignorieren.
Was mach ich denn nun schon wieder falsch?
Sorry, bin ein Newbie und hab fast keine Haare mehr zum raufen :-)
:)
Mozilla gibt keine Hex- sondern RGB-Farbwerte zurück.
Is' halt so ... :)
Muß man mit anderer Logik dran, oder aber RGB-Farbwert in einen "Standard"-Hex-Farbwert ändern.
Entsprechende Funktionen gibt's im Netz - auch hier via Archiv-Suche (bin gerade a) zu faul und b) zu beschäftigt :)).
Gruß, Cybaer
Vielen Dank für den Tip, hat funktioniert. Ich frage nun einfach beide Werte ab, Hex und RGB.
Merci!
hi,
Die Funktion onFocus="if(this.blur)this.blur()" ist eigentlich dazu da, um den hässlichen Linkrahmen zu elimieren. Beisst sich aber natürlich mit a:active, weil die "Aktivität" des Links ja quasi sofort wieder ausgeschaltet wird.
Selbst ohne die Funktion gilt :active nur so lange, wie du den Link betätigst, also z.B. auf ihm die Maustaste runterdrückst.
:active hat absolut gar nichts mit einem eventuell "aktiven" Dokument in einem Frameset o.ä. zu tun, auch wenn viele Leute und der IE das verwechseln.
gruß,
wahsaga
Danke für die Antworten.
Habe den Code nun noch mal umgefummelt. Nun sieht es im Menüframe so aus:
JS:
function hove(e) {
if (document.getElementsByTagName("a")[e].style.backgroundColor != "#0000ff")
{
document.getElementsByTagName("a")[e].style.backgroundColor = "#aaaaff";
document.getElementsByTagName("a")[e].style.color = "#ffffff";
}
}
function norm(e) {
if (document.getElementsByTagName("a")[e].style.backgroundColor != "#0000ff")
{
document.getElementsByTagName("a")[e].style.backgroundColor = "#ffffff";
document.getElementsByTagName("a")[e].style.color = "#000000";
}
}
BODY:
<a href="main.htm" onmouseover="hove(0)" onmouseout="norm(0)" onFocus="if(this.blur)this.blur()" id="main" target="mainFrame">Startseite</a>
<a href="testlink1.htm" onmouseover="hove(1)" onmouseout="norm(1)" onFocus="if(this.blur)this.blur()" id="testlink1" target="mainFrame">testlink</a>
<a href="testlink2.htm" onmouseover="hove(2)" onmouseout="norm(2)" onFocus="if(this.blur)this.blur()" id="testlink2" target="mainFrame">testlink2<a>
usw.
Im Inhaltsframe (hier z.b. in testlink1.htm) steht dann als JS:
for (var hd = 0; hd < parent.topFrame.document.getElementsByTagName("a").length; hd++) {
parent.topFrame.document.getElementsByTagName("a")[hd].style.backgroundColor = "#ffffff";
parent.topFrame.document.getElementsByTagName("a")[hd].style.color = "#000000";
}
parent.topFrame.document.getElementById("testlink1").style.color = "#ffffff";
parent.topFrame.document.getElementById("testlink1").style.backgroundColor = "#0000ff";
Das funktioniert im IE auch ganz prächtig. Allerdings in Mozilla nicht. Die Abfrage im Menüframe
if (document.getElementsByTagName("a")[e].style.backgroundColor != "#0000ff")
scheint Mozilla komplett zu ignorieren.
Was mach ich denn nun schon wieder falsch?
Sorry, bin ein Newbie und hab fast keine Haare mehr zum raufen :-)
Gruß,
Heinz