scriptwelt.org das JavaScript Archiv

Navigation
Startseite
Audio & Sound
Formulare
Cookies
Fenster & Frame
Grafik & Text
Navigation
Suche Scripts
Fun und Spiele
Buttons
Diverse
Tutorials

Kontakt
eine Mail an ScriptWelt.org
Webhosting
Tipps zur Providerwahl und zum Webspace

JavaScript in eine HTML Datei einbinden

Sind JavaScripts sicher?

Links zum Thema JavaSript

Impressum
impressum

Fenster & Frame JavaScript / Stylesheet per Klick ändern

Ein JavaScript, mit dem sich ein Stylewechsel per Klick leicht realisieren läßt. Da der Browser immer das letzte Stylesheet als das erste nimmt, gibt es einen kleinen Trick im Code: den ersten Sheet als erstes und als letztes im Code schreiben
Autor: etLux
zur Demo

 

in den <head> einfügen

<link rel="stylesheet" href="style_1.css">
<link rel="stylesheet" href="style_2.css">
<link rel="stylesheet" href="style_3.css">
<link rel="stylesheet" href="style_4.css">
<link rel="stylesheet" href="style_1.css">

<script language="JavaScript">
var doAlerts=true;
function changeSheets(whichSheet){
whichSheet=whichSheet-1;
if(document.styleSheets){
var c = document.styleSheets.length;
if (doAlerts) alert('Change to Style '+(whichSheet+1));
for(var i=0;i<c;i++){
if(i!=whichSheet){
document.styleSheets[i].disabled=true;
}else{
document.styleSheets[i].disabled=false;
}
}
}
}

</script>

in den <body> einfügen

<a href="JavaScript:changeSheets(1)">Style One</a>
<a href="JavaScript:changeSheets(2)">Style Two</a>
<a href="JavaScript:changeSheets(3)">Style Three</a>
<a href="JavaScript:changeSheets(4)">Style Four</a>