CSS Per klick ändern und als cookie speicher

Mway · 29.03.2011

Hey vielleicht könnt ihr mir helfen.

Wir machen im moment eine Seite, in der es oben 4 Farbfelder gibt. Wenn ich eines der Farbfelder klicke, soll sich eine andere CSS laden in der andere Hintergrundgrafiken geladen werden.

Das ganze soll noch in einen Cookie geschrieben werden damit nicht bei jedem klicken eines Navigationspunkts sich die Farbe wieder auf standart stellt.

Kennt hierzu jemand ein gutes Tutorial oder hat ein Tip auf lager.

Ach ja den Button mit Get übergeben geht nicht da sonst mein Querystring für die ganzen anderen Funktionen nicht mehr stimmt.

fexx · 29.03.2011

AW: CSS Per klick ändern und als cookie speicher

schau mal hier ... da ist sicher was dabei:

Mway · 29.03.2011

AW: CSS Per klick ändern und als cookie speicher

ach ja ich weiß Google.

Auf die Idee bin ich natürlich auch schon gekommen

MegaAdi · 29.03.2011

AW: CSS Per klick ändern und als cookie speicher

das ganze ist recht einfach zu gestallten... du lässt im head den Teil wo des css eingebunden wird per php ausgeben und in das cookie kommt der name der CSS-Datei.

sprich alla echo '<link rel="stylesheet" type="text/css" href="'.$_COOKIE["css"].'.css">';

und in den Links übergibst du via get/request dann den Stylesheet-Name an eine PHP-Datei und erstellst dort dann ein Cookie mit den get/request-Daten

also www.deinedomain.de/style.php?css=[css-name]

Ich hoffe das ist das, was du suchst

Gruß Adrian

Mway · 29.03.2011

AW: CSS Per klick ändern und als cookie speicher

Bin jetzt nicht der php Profi kannst es vielleicht etwas mehr ausführen ?

netbandit · 29.03.2011

AW: CSS Per klick ändern und als cookie speicher

Bei solchen Kleinigkeiten brauchts kein Cookie und erst recht kein PHP, da missbraucht man einfach window.name, Beispiel:

erste_seite.htm

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 
<html>
<head>
<title>Erste Seite</title>
<meta http-equiv="Content-Language" content="de">
<meta http-equiv="Content-Type" content="text/html; UTF-8">
<script type="text/javascript"> 
function change_bg(wert)
    {
    window.name=wert;
    document.getElementsByTagName('body')[0].style.backgroundColor = wert;
}
window.onload=function (){change_bg(window.name);}
</script>
</head>
<body>
<h1>Erste Seite</h1>
<a href="" onClick="change_bg('red');return false;">red</a><br>
<a href="" onClick="change_bg('green');return false;">green</a><br>
<a href="" onClick="change_bg('yellow');return false;">yellow</a><br>
<a href="" onClick="change_bg('blue');return false;">blue</a><br>
<a href="" onClick="change_bg('white');return false;">white</a><br>&nbsp;<br>
<a href="zweite_seite.htm">Zweite Seite »</a>

</body>
</html>

zweite_seite.htm

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 
<html>
<head>
<title>Zweite Seite</title>
<meta http-equiv="Content-Language" content="de">
<meta http-equiv="Content-Type" content="text/html; UTF-8">
<script type="text/javascript"> 
function change_bg(wert)
    {
    window.name=wert;
    document.getElementsByTagName('body')[0].style.backgroundColor = wert;
}
window.onload=function (){change_bg(window.name);}
</script>
</head>
<body>
<h1>Zweite Seite</h1>
<a href="" onClick="change_bg('red');return false;">red</a><br>
<a href="" onClick="change_bg('green');return false;">green</a><br>
<a href="" onClick="change_bg('yellow');return false;">yellow</a><br>
<a href="" onClick="change_bg('blue');return false;">blue</a><br>
<a href="" onClick="change_bg('white');return false;">white</a><br>&nbsp;<br>
<a href="erste_seite.htm">Erste Seite »</a>
</body>
</html>

Grüße

Mway · 29.03.2011

AW: CSS Per klick ändern und als cookie speicher

ich glaube das kann so nicht ganz richtig sein, da wir ja eine index.php habe in die per include die jeweiligen unterseiten geladen werden.

Bedeutet also wenn ich ein link klicke wird meine Seite wieder auf Standartfarbe gesetzt

netbandit · 29.03.2011

AW: CSS Per klick ändern und als cookie speicher

Nicht wenn das Script in jede Seite eingebunden ist -> deshalb habe ich Dir ja zum Testen zwei Seiten gepostet

Mway · 29.03.2011

AW: CSS Per klick ändern und als cookie speicher

das scheint mir nicht die feine englische zu sein, vorallem weil ich ja in den Seiten die eingebunden werden z.B garkein Head habe da dieser sich ja sonst in der index verdoppelt.

netbandit · 29.03.2011

AW: CSS Per klick ändern und als cookie speicher

Na, wenn der Header nur in der Index ausgegeben wird umso besser - heisst Du brauchst es nur dort einfügen ... also testen

Mway · 29.03.2011

AW: CSS Per klick ändern und als cookie speicher

hab mir gerade nochmal dein Script genau angeschaut, wenn ich dieses script nehme wird ja nur die hintergrundgrafik des Bodys umgeschrieben. Wir haben aber mehr Grafiken die in DIV´s liegen die dann per anderem CSS umgewandelt werden.

Edit: Problem hat sich gelöst, Kollegin hat es schon hinbekommen.

netbandit · 29.03.2011

AW: CSS Per klick ändern und als cookie speicher

... eine andere CSS-Datei laden sollte dann ungefähr so gehen:

statt

HTML:

document.getElementsByTagName('body')[0].style.backgroundColor = wert;

sollte

HTML:

document.write('<link rel=stylesheet type="text/css" href="'+wert+'.css">');

funktionieren.

Grüße