Dynamisch CSS einbinden

[antihero]

Hallo Leute,

ich habe mal wieder ein etwas komplizierteres Problem in Sachen CSS und Javascript. Da Caminus bei meinem letzten problem noch nicht überfordert war, dachte ich ich biete ihm mal eine neue Herausforderung... Natürlich dürfen auch alle anderen mitraten...

Das Problem
Ich arbeite mit zwei Framesets. Das eine ist Layout der Fachseite (Fachpublikum) und das andere ist Layout der Laienseite (logisch: Laienpublikum). In der Regel sind die Inhalte dieser beider Seiten anders, in einigen wenigen Themen überschneiden sie sich aber. Glücklicherweise ists kein Problem, einfach eine Datei aus der Fachseite in die Laienseite zu implementieren. Allerdings arbeiten beide Seiten mit einer anderen CSS Datei, das heisst, in der Fachseite ist die ganze Schrift immer schwarz, in der Laienseite immer grün.
Ich möchte nun mit Javascript (wahrscheinlich) eine Lösung realisieren, welche es ermöglicht je nach Frameset, in welchem die Datei geöffnet wird, ein anderes CSS einzubinden...

Vielen Dank für eure Anstrengungen, Ich hoffe meine Problemstellung ist einigermassen klar.

antihero

PS: ich weiss, am einfachsten wäre es, dass ganze so zu lösen, indem man die Datei einfach doppelt ablegt, einmal im Laienordner und einmal im Fachordner. Beide Dateien sind identisch bis auf den CSS aufruf. Ich werde das Problem auch so lösen, wenns keinen anderen Weg gibt, aber mein Chefe meint, es wäre eleganter eine dynamische Lösung zu haben...

 

[THE REAL TOOLKIT]

ungefähr so:
if(parent.framename.location=="laienseite.html")
{
//css datei einbindung
}
else...

 

[antihero]

Vielen Dank... Wahrscheinlich habe ich mich etwas ungenau ausgedrückt. Genau diesen Teil des Codes kann ich knapp noch selber schreiben/zusammenbasteln. Aber ich habe keine Ahnung wie man mit JS eine CSS Datei einbindet... Deiner Antwort nach eine Newbiefrage...?!

antihero

 

[Adam Wille]

Indem du den Code für das Einbinden des Stylesheets dynamisch schreibst:

document.write("<link rel='stylesheet' type='text/css' href='style.css'>");

hth,
Geist

 

[Thomas Lindner]

Ich habs in einem ähnlichen Problem folghendermaßen gelöst:

Teilcode:

...
document.getElementById("CSS").href = "beginn.css"
...

..ist jedoch (leider) nur IE tauglich!

 

[antihero]

Douh.....
Vielen Dank Geist... Warum nur kommt man auf die einfachen Dinge nie selber...
Naja, vielen Dank!

antihero

 

[antihero]

Original geschrieben von THE REAL TOOLKIT
ungefähr so:
if(parent.framename.location=="laienseite.html")
{
//css datei einbindung
}
else...

Original geschrieben von antihero
Wahrscheinlich habe ich mich etwas ungenau ausgedrückt. Genau diesen Teil des Codes kann ich knapp noch selber schreiben/zusammenbasteln.

Shame on me... Irgendwie funktionierts mit dem oben genannten Befehl von THE REAL TOOLKIT nicht so ganz...
Keine weiteren Ausführungen, der Javascript-Yoda ist mit soeben erschienen und hat mir mitgeteilt dass meine JS Künste auf ewig unwürdig waren und bleiben werden. Auf mein Versprechen mir nie mehr auch nur entfernte JS Künste anzumassen, hat er mir wenigstens versichert, das mir im Forum tutorials.de Hilfe bekomme... Also Jungs, ihr habt eine Prophezeiung zu erfüllen...

Vielen Dank für eure Hilfe!

antihero

 

[Adam Wille]

Naja, eben in die Framedatei ein JavaScript setzen, welches die Source-URL der Framesetdatei ausliest und entsprechend agiert:

<script type="text/javascript" language="JavaScript">
<!--

if (top.location.href == "frameset1.html") {
    alert("Hurra, jetzt bin ich in Frameset1.");
} else if (top.location.href == "frameset2.html") {
    alert("Hey, nun steck ich ja doch in Frameset2!");
}

//-->
</script>

hth,
Geist

 

[antihero]

Hast du das bei dir getestet Geist? Bei mir funktionierts irgendwie nicht so ganz...
Ok, vielleicht zum Verständnis mal wie ich das ganze interpretieren würde:

Ich habe in einem Ordner zwei Framsetdateien welche frameset1.html und frameset2.html heissen. Diese Framesetdateien enthalten im Minimum folgenden Code:

<frameset rows='10,*'>
 <frame name='topF' src='top.html'>
 <frame name='mainF' src='wasa.html'>
</frameset>

Die Datei wasa.html enthält den Code den du gepostet hast, nämlich:

<script language="JavaScript" type="text/javascript">
<!--

if (top.location.href == "frameset1.html") {
    alert("Hurra, jetzt bin ich in Frameset1.");
} else if (top.location.href == "frameset2.html") {
    alert("Hey, nun steck ich ja doch in Frameset2!");
}

//-->
</script>

Und nun sollte je nach Framset indem die Datei geöffnet wird ein Popup mit einer anderen Nachricht erscheinen... Tut es aber nicht. In der Mozilla Javascript Console erscheint die Meldung:
"Error Page has no Properties:
Source-File: chrome://bannerblind/content/bannerblindOverlay.js Line: 80

Und das find schonmal reichlich schräg. Obwohl, vielleichts ists ja nur ne Meldung von Yoda...
Ich hab die Seite auch mehrmals neu geladen und die Fehlermeldung erscheint tatsächlich nur beim ausführen des obigen JS Codes...

Vielleicht hab ich ja deine Erklärung auch nur falsch verstanden...?

antihero

PS: Was heisst eigentlich hth? hate the humans?

 

[Adam Wille]

Was schmeißt dir denn folgende Zeile, einfach mal in ein wasa.html-JavaScript eingefügt, aus:

alert(top.location.href);

Debugging nennt man sowas.

hth steht übrigens für "hoping to help",

Geist