Dynamisch externes Stylesheet austauschen

Mysteryxx · 14.12.2007, 20:13

Ich hab ein kleines Problem mit einer meiner Seiten, die eine Druckdarstellung enthalten soll. Ist eigentlich nicht weiter schwer mit PHP zu machen, einfach den Tag im head austauschen, aber das Problem ist, dass das ganze auch offline funktionieren soll.
Deswegen bin ich auf JavaScript umgestiegen (hab ich nich nicht so viele Erfahrungen drin) und würde gern wissen, wie man per JS bei Klick auf einen Link ein anderes externes CSS (durch das der Text für Ausdrucke optimiert wird) einbindet.
Könnt ihr mir da helfen?

Rizzo · 14.12.2007, 21:12

Das kann man auch mir reinem CSS machen: Medientyp

theo · 15.12.2007, 11:19

falls "offline" fuer "nicht auf einem festen online server" stehen sollte: server2go

Malleus · 15.12.2007, 13:47

...und hier die reine Javascript Variante:

Test

PHP-Code:


			
<html>

<head>

<title>Malleus' Javascript FAQ: Wie tausche ich zur Laufzeit eine geladenes Stylesheet gegen ein anderes aus?</title>

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



var cssNames = [ "changeStyleSheet1.css" , "changeStyleSheet2.css" ],

cssMode = 0;



function changeStyleSheet()

{

document.getElementById( 'myCSS ).href = cssNames[ cssMode = 1 - cssMode ];

}

</script>

<link rel="stylesheet" id="myCSS" type="text/css" href="changeStyleSheet1.css">

</head>

<body>

<div>Hallo</div>

<p>

<button onclick="changeStyleSheet()">Lade anderes StyleSheet</button>

</body>

</html>

Mysteryxx · 15.12.2007, 14:05

Danke für die schnellen Antworten. Das Script ist gut, so was in der Art werde ich wahrscheinlich auch einbauen.