XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   Knowledge Base (http://xhtmlforum.de/forumdisplay.php?f=79)
-   -   Design Wahl per CSS?? (http://xhtmlforum.de/showthread.php?t=31987)

CReal 12.07.2003 03:14

Design Wahl per CSS??
 
Hallo!

Ich suche eine Möglichkeit per Button ein neues CSS file dem aktuellen Document zuzuweisen.

Also eine Art "Designwahl". Button 1 soll von mir aus bewirken das alle Tables braun sind... auf Button 2 von mir aus wird alles grün.

Ich hab schon alles probiert komme aber überhaupt nicht weiter...


Danke für Tips!

CREAL

Thomas (css 4 you) 12.07.2003 09:43

Hi CReal,
was heißt du hast schon alles probiert?
Javascript, Cookies, PHP?
Welche Möglichkeiten stehen dir zur Verfügung?

Gruß
Thomas

CReal 12.07.2003 10:30

Naja...
 
Hi!

Also mit php is das ja kein Problem nur leider kann ich php nicht nutzen.

Ich muss das irgendwie mit CSS, Javascript oder HTML machen.

So siehts aus...aber ich hab gehört das dafür nicht unbedingt php nötig ist. Diese ganzen Background-change scripte gehen schon. Aber eben sie ändern nur den background. Und ich glaube das machen sie ganz ohne css nur per java.

...creal...

CReal 12.07.2003 13:11

das müsste man nur noch verbessern
 
<script language="JavaScript1.2">
function changesettings(){
if (document.all){
if (document.body.style.cssText==''||document.body.st yle.backgroundColor=='white')
document.body.style.cssText="background-color:black;color:white;background-image:url()"
else
document.body.style.cssText="background-color:white;color:black"
}
}
</script>
Umschalten

Das funktioniert zwar, jedoch kann ich eben nicht externe CSS files einbinden, und auch nur die BACKGROUND-COLOR ändert sich. Ich habs bis jetzt nicht geschafft das script an meine Vorstellung anzupassen...

:::

Thomas (css 4 you) 12.07.2003 14:14

Du kannst aber beim Seitenaufruf so etwas einfügen:
Code:

<link rel="Stylesheet" href="default.css"  type="text/css" />
<script type="text/javascript"><!--

document.write('<link rel="Stylesheet" href="design1.css"  type="text/css" />')
//--></script>

Nun müsstest du für einen Stylewechsel die zu ladende CSS-Datei z.B. als Cookie ablegen, sobald der User ein neues Design wählt.


Thomas

CReal 12.07.2003 15:33

Danke.

Werd ich gleich mal ausprobieren.

:)

ulle 14.07.2003 22:05

Zitat:

Zitat von Thomas (css 4 you)
Nun müsstest du für einen Stylewechsel die zu ladende CSS-Datei z.B. als Cookie ablegen, sobald der User ein neues Design wählt.
Thomas

:?:

Hallo Thomas,

könntest Du dies mal ausführlicher erläutern.

Thomas (css 4 you) 14.07.2003 23:47

Naja,
nehmen wir an, du stellst fünf unterschiedliche Designs zur Verfügung,
dann nimmst du ein select-Feld:
Code:

<form name="myform"  onsubmit="setcookie()">
<select name="design">
<option value="css1">Design 1</option>
<option value="css2">Design 2</option>
<option value="css3">Design 3</option>
<option value="css4">Design 4</option>
<option value="css5">Design 5</option>
</select>

...

<form>

Die Funktion setcookie() speichert die aktuelle Designauswahl des Users als Cookie ab und reloaded das Dokument
Code:

document.cookie="Gültigkeitsdatum" + aktuelleauswahl
location.reload()

Im Dokumentenkopf wird beim Laden jedesmal der Cookieinhalt abgefragt und dann das Stylesheet geladen.
Code:

cssfile=document.cookie+".css"
document.write('<link rel="Stylesheet" href="'+cssfile+'"  type="text/css" />')

Ich habe es zwar nicht getestet, es müsste aber so funktionieren.

Gruß
Thomas

Anonymous 17.07.2003 11:07

Styleswitcher
 
Ausführliche Infos zum Styleswitcher inklusive Cookies setzen:

http://www.alistapart.com/stories/alternate/

Frohen Layoutwechsel,

MLB

Anonymous 18.07.2003 09:22

<link rel="stylesheet" href="../CSS/html.css" type="text/css" title="Standard Gelb">
<link rel="alternative stylesheet" href="../CSS/html2.css" type="text/css" title="Standard Blau">


function changeStyle(j)
{
for (i=0; i<document.styleSheets.length; i++)
{
if (i != j) document.styleSheets[i].disabled = true;
else document.styleSheets[i].disabled = false;
}
}


Alle Zeitangaben in WEZ +2. Es ist jetzt 21:32 Uhr.

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

© Dirk H. 2003 - 2020