# Dynamisch CSS einbinden



## antihero (26. März 2003)

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 (26. März 2003)

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


----------



## antihero (26. März 2003)

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 (26. März 2003)

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 (26. März 2003)

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

Teilcode:


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

..ist jedoch (leider) nur IE tauglich!


----------



## antihero (26. März 2003)

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

antihero


----------



## antihero (2. April 2003)

> _Original geschrieben von THE REAL TOOLKIT _
> *ungefähr so:
> if(parent.framename.location=="laienseite.html")
> {
> ...





> _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 (2. April 2003)

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 (3. April 2003)

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 (3. April 2003)

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


----------



## Sebastianus (3. April 2003)

[Off-Topic]
hth könnte auch "Hat tierisch Hunger" heißen oder "Heute tatkräftig helfen".

Offizielle Abkürzungen wären noch:
- Hochtemperaturhydrierung
- High Test Hypochlorite
- Hawthorne - USA, Nevada (Internationaler Airport-Code)

oder halt richtig:
hope this helps 
[/Off-Topic]


----------



## Adam Wille (3. April 2003)

Der Kontext prägt den Ausdruck. 

Geist


----------



## arhol (8. Juni 2006)

Adam Wille hat gesagt.:
			
		

> Indem du den Code für das Einbinden des Stylesheets dynamisch schreibst:
> 
> ```
> document.write("<link rel='stylesheet' type='text/css' href='style.css'>");
> ```




Hallo Leute,
habe ein ähnliches Problem: Möchte genau diesen Befehl für <a href""> verwenden. Der benutzer soll also mit einem Buttonklick den Hintergrund/das Hintergrundbild verändern können. Kann mir dabei jemand als Newbie weiterhelfen  Wäre wirklich sehr dankbar!

Vielen Dank im Voraus, Beste Grüße


----------

