XHTMLforum - Stylesheet dateien wechseln

XHTMLforum (http://xhtmlforum.de/index.php)

- CSS (http://xhtmlforum.de/forumdisplay.php?f=73)

- - Stylesheet dateien wechseln (http://xhtmlforum.de/showthread.php?t=60633)

Stylesheet dateien wechseln

Hallo,

ich möchte durch buttonclick/Linkclick in einer html datei zwischen mehreren css dateien hin und her schalten können.

ich habe meine normale css datei, eine mit großer schriftgröße und eine mit kleiner schriftgröße.
durch linkklick möchte ich die verschiedenen stylesheets anwenden können.

wie ist dies realisierbar?

danke für die hilfe.
MFG
deffcon

Hallo!

Ich würde es mit PHP und einer Session lösen.
Du gibt in der Session-Variable einen Standardwert für den Schriftgrad.
Wenn man auf einen Link klickt, wird die Variable angepasst.
Das könnte so aussehen:

HTML-Code:

<?

session_start();

if($_SESSION['css'] != '') $_SESSION['css'] = 'normal.css';

if(isset($_GET['change_css']

{

  switch($_GET['change_css'])

  {

    case 'klein': $_SESSION['css'] = 'klein.css';break;

    case 'normal': $_SESSION['css'] = 'normal.css';break;

    case 'gross': $_SESSION['css'] = 'gross.css';break;

  }

}

?>

[...]

<link rel="stylesheet" type="text/css" href="<?=$_SESSION['css']?>" />

[...]

<body>

[...]

<a href="index.php?change_css=klein">klein</a><br />

<a href="index.php?change_css=normal">normal</a><br />

<a href="index.php?change_css=gross">groß</a><br />

[...]

</body>

Vielen Dank Herr Walter.
Ich habe leider keinerlei Kenntnisse in php.
Ich habe jetzt versucht meine index.html datei einfach in index.php umzunennen, habe die drei css dateien (klein.css, gross.css und normal.css) angelegt und die Zeilen von dir kopiert.
Wenn ich einen Link anklicke ändert sich in der Adresszeile des browsers hinten dran "?change_css=klein".
Die CSS datei wendet es aber nicht an.
ich habe wahrscheinlich die zeilen an die falsche stelle kopiert.

können sie mir noch ein mal schreiben, wo das genau hinkommt?

mfg
deffcon

Sag doch mal, was im Quelltext anstelle von <link rel="stylesheet" type="text/css" href="<?=$_SESSION['css']?>" /> steht, wenn du die index.php aufrufst und was da steht, nachdem du den link angeklickt hast.

in der seitenquelle ändert sich garnichts.
ich habe die css dateien im gleichen verzeichnis wie die index.php.
ich stelle jetzt einfach mal den kompletten html quelltext rein.
vielleicht hab ichs ja nur falsch kopiert:

HTML-Code:





<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

<html>

<head>

<title>Startseite meiner Bewerbung</title>

<meta name="author" content="Simon Kraus">

<meta name="editor" content="html-editor phase 5">





<img src="images/head.jpg" alt="Header" usemap="#HeaderMap" border="0" id="header"/>

<map name="HeaderMap" id="HeaderMap">

<area shape="circle" coords="136,70,59" href="http://www.tu-dresden.de"/>

</map>

</head>

<?

session_start();

if($_SESSION['css'] != '') $_SESSION['css'] = 'normal.css';

if(isset($_GET['change_css']

{

  switch($_GET['change_css'])

  {

    case 'klein': $_SESSION['css'] = 'klein.css';break;

    case 'normal': $_SESSION['css'] = 'normal.css';break;

    case 'gross': $_SESSION['css'] = 'gross.css';break;

  }

}

?>

<body>



<link rel="stylesheet" type="text/css" href="<?=$_SESSION['css']?>" />

<ul class="navi" style="width: 224px">

<li><a class="naviMainActive" href="index.php">Willkommen</a></li>

<li><a class="naviMain" href="menue1.html">Men&uuml;punkt 1</a></li>



</ul>



<div id="textarea">

<p align="center"> Startseite </p>

<p align="center">





<a href="index.php?change_css=klein">klein</a><br />

<a href="index.php?change_css=normal">normal</a><br />

<a href="index.php?change_css=gross">groß</a><br /></p>



</div>



<a href="mailto:deffcon@web.de"><image src="images/mail.jpg" class="mail" alt="E-Mail 



senden"/></a>

</body>

</html>

ich hatte es schon in verschiedenen varianten versucht und keins klappte.
habe jetzt das "session start" ganz oben und den <link rel... im head.
im seitenquelltext des browsers sieht das dann so aus:

HTML-Code:



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

<html>

<?

session_start();

if($_SESSION['css'] != '') $_SESSION['css'] = 'normal.css';

if(isset($_GET['change_css']

{

  switch($_GET['change_css'])

  {

    case 'klein': $_SESSION['css'] = 'klein.css';break;

    case 'normal': $_SESSION['css'] = 'normal.css';break;

    case 'gross': $_SESSION['css'] = 'gross.css';break;

  }

}

?>

<head>

<title>Startseite meiner Bewerbung</title>

<meta name="author" content="Simon Kraus">

<meta name="editor" content="html-editor phase 5">

<link rel="stylesheet" type="text/css" href="<?=$_SESSION['css']?>" />

<img src="images/head.jpg" alt="Header" usemap="#HeaderMap" border="0" id="header"/>

<map name="HeaderMap" id="HeaderMap">

<area shape="circle" coords="136,70,59" href="http://www.tu-dresden.de"/>

</map>

</head>



<body>



<ul class="navi" style="width: 224px">

<li><a class="naviMainActive" href="index.php">Willkommen</a></li>

<li><a class="naviMain" href="menue1.html">Men&uuml;punkt 1</a></li>

<li><a class="naviMain" href="#">Men&uuml;punkt 2</a></li>

<li><a class="naviMain" href="#">Men&uuml;punkt 3</a></li>

<li><a class="naviMain" href="#">Men&uuml;punkt 4</a></li>



<li><a class="naviMain" href="#">Men&uuml;punkt 5</a></li>

</ul>



<div id="textarea">

<p align="center"> Startseite </p>

<p align="center">





<a href="index.php?change_css=klein">klein</a><br />

<a href="index.php?change_css=normal">normal</a><br />

<a href="index.php?change_css=gross">groß</a><br /></p>



</div>



<a href="mailto:deffcon@web.de"><image src="images/mail.jpg" class="mail" alt="E-Mail senden"/></a>



<a href="#"><image src="images/klein.jpg" class="font1" alt="kleine Schrift"/></a>

<a href="#"><image src="images/normal.jpg" class="font2" alt="normale Schrift"/></a>

<a href="#"><image src="images/gross.jpg" class="font3" alt="grosse Schrift"/></a>

</body>

</html>

Worunter testest du denn das?
Denn eigentlich sollte der PHP-Teil gar nicht im Browserquelltext auftauchen.
Scheinbar wird dein PHP nicht geparsed.
Hast du ein Online-Beispiel?
Alternativ kannst du hier mal die QCs der CSS-Dateien reinstellen,
dann probier ich das auf meinem Webspace einmal aus.
Denn eigentlich sollte es genau so funktionieren.

EDIT:
Ich sehe gerade, dass du phase-5 verwendest.
Wenn du dort eine Seitenvorschau hast und diese nutzt,
dann kann es natürlich nicht funktionieren ;)
Du brauchst auf jeden Fall mindestens online Webspace
oder einen lokalen Webserver, wenn du es mit PHP
machen willst.

ich habe es mal eben auf einen funpic webspace hochgeladen.
beim aufrufen bringt es einen parse error für folgende zeile:
"switch($_GET['change_css'])"
mit begründung "syntax error, unexpected T_SWITCH"

der pagelink ist:
http://emohair.em.funpic.de/index.php

eine css datei wäre
http://emohair.em.funpic.de/normal.css

ich bin mir aber nicht sicher ob der webspace php voll unterstützt.
werde mal nachsehen.

von phase 5 habe ich mir nur die metatags geholt.
mache eigentlich alles im editor gerade.

//Edit
webspace sagt:
(PHP 5) für jede Homepage verfügbar

if(isset($_GET['change_css']

Da habe ich mich verschrieben.
Es muss so aussehen:
if(isset($_GET['change_css']))

und schreib den PHP-Teil bitte ganz nach oben über das

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

<html>

Session können nur gestartet werden, wenn noch keine Ausgabe stattgefunden hat.

EDIT:
Also so:

HTML-Code:

<?

session_start();

if($_SESSION['css'] != '') $_SESSION['css'] = 'normal.css';

if(isset($_GET['change_css']))

{

  switch($_GET['change_css'])

  {

    case 'klein': $_SESSION['css'] = 'klein.css';break;

    case 'normal': $_SESSION['css'] = 'normal.css';break;

    case 'gross': $_SESSION['css'] = 'gross.css';break;

  }

}

?>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

<html>

<head>

EDIT2:
if($_SESSION['css'] != '') $_SESSION['css'] = 'normal.css';
muss
if($_SESSION['css'] == '') $_SESSION['css'] = 'normal.css';

heißen.
hier noch mal, wie es aussehen muss:

HTML-Code:



<?

session_start();

if($_SESSION['css'] == '') $_SESSION['css'] = 'normal.css';

if(isset($_GET['change_css']))

{

  switch($_GET['change_css'])

  {

    case 'klein': $_SESSION['css'] = 'klein.css';break;

    case 'normal': $_SESSION['css'] = 'normal.css';break;

    case 'gross': $_SESSION['css'] = 'gross.css';break;

  }

}

?>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

<html>

<head>

<title>Startseite meiner Bewerbung</title>

<meta name="author" content="Simon Kraus">

<meta name="editor" content="html-editor phase 5">

<link rel="stylesheet" type="text/css" href="<?=$_SESSION['css']?>" />

<img src="images/head.jpg" alt="Header" usemap="#HeaderMap" border="0" id="header"/>

<map name="HeaderMap" id="HeaderMap">

<area shape="circle" coords="136,70,59" href="http://www.tu-dresden.de"/>

</map>

</head>