XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   Stylesheet dateien wechseln (http://xhtmlforum.de/showthread.php?t=60633)

Deffcon 20.03.2010 22:26

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

Walter IT-Services 20.03.2010 23:00

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>


Deffcon 20.03.2010 23:34

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

Walter IT-Services 20.03.2010 23:45

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.

Deffcon 20.03.2010 23:58

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>


Walter IT-Services 21.03.2010 00:08

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

Muss in den Head ;)

Außerdem wollte ich den Quelltext sehen, wenn du die index.php per Browser aufgerufen hast ^^

Deffcon 21.03.2010 00:13

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>


Walter IT-Services 21.03.2010 00:15

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.

Deffcon 21.03.2010 00:23

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

Walter IT-Services 21.03.2010 00:29

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>



Alle Zeitangaben in WEZ +2. Es ist jetzt 02:48 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2022, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2022