 Willkommen auf dem Portal für Mediengestalter
|
|
|
| Autor |
Nachricht |
bluespoon
Threadersteller
Dabei seit: 10.11.2006
Ort: Hannover
Alter: 41
Geschlecht: 
|
Verfasst Fr 20.07.2007 20:44
Titel CSS global via JS ändern? |
  |
|
Hallo,
ich habe ein kleines Problem. Ich möchte gerne eine CSS-Eigenschaft via JS
ändern (background-image). Allerdings soll diese Eigenschaft für den kompletten
Aufenthalt und alle Elemente auf der Homepage geändert werden. Und nicht nur
für die, die gerade geladen sind. Es darf außerdem kein Reload der Seite erfolgen.
Na ja, damit Ihr wisst worum es geht: http://www.explizit-alanis.de/po3/
Hier einfach mal auf das Icon "Einstellungen" klicken, links "Farbdesign" auswählen
und auf "hallo" klicken. Soweit so gut ... aber wenn man jetzt das Fenster verschiebt
und auf das Ordnersymbol klickt, dann öffnet sich wieder ein blaues Fenster. Schließt
man das "Farbdesignfenster" und öffnet es erneut, ist es auch wieder blau.
Das JS zum Ändern der CSS-Eigenschaft:
| Code: | function eigenschaften(objId,x,theProp,theValue) {
var obj = null; with (document) {
if (getElementById)
obj = getElementById(objId);
}
if (obj) {
if (theValue == true || theValue == false)
eval("obj.style."+theProp+"="+theValue);
else eval("obj.style."+theProp+"='"+theValue+"'");
}
} |
Hier werden alle Hintergrundbilder auf Klick geändert (die momentan geladen sind):
| Code: | function farbe_silber() {
eigenschaften('window','','backgroundImage','url(gfx/window_silver_bg.png)','DIV');
eigenschaften('window_settings','','backgroundImage','url(gfx/window_settings_silver_bg.png)','DIV');
eigenschaften('start_bar','','backgroundImage','url(gfx/start_bar_silver.png)','DIV');
eigenschaften('start_menu','','backgroundImage','url(gfx/start_menu_silver_bg.png)','DIV');
}
|
Ich hoffe, ich habe es net soooo umständlich erklärt. Hat jemand eine Lösung für dieses Problem?
Also ich möchte auch beim erneuten laden eines DIV mit dem (eigentlich) blauen Hintergrundbild
ein silbernes ausgeben
Liebe Grüße,
Patrick
|
|
| |
   |
 |
sahnemuh
Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht:
|
|
| |
|
|
|
Anzeige
|
|
|
bluespoon
Threadersteller
Dabei seit: 10.11.2006
Ort: Hannover
Alter: 41
Geschlecht:
|
Verfasst Fr 20.07.2007 21:14
Titel Cookie setzen ... |
|
|
Hm ... also wenn das Speichern oder Setzen eines Cookies so funktioniert:
| Code: | | document.cookie = x |
Dann speichere ich hiermit die CSS-Eigenschaft?
| Code: | | document.cookie = eigenschaften('window','','backgroundImage','url(gfx/window_silver_bg.png)','DIV'); |
Ich habe noch nie einen Cookie gesetzt, aber das sieht mir net richtig aus. Funktioniert im
Übrigen auch net. Es wird auch nichts ausgegeben.
Die Eigenschaften werden zwar trotzdem geändert, aber der Browser merkt sich das net.
Zuletzt bearbeitet von bluespoon am Fr 20.07.2007 21:16, insgesamt 1-mal bearbeitet
|
|
| |
|
|
Raumwurm
Dabei seit: 21.12.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Fr 20.07.2007 22:07
Titel
|
|
|
Oder Du setzt einfach eine Variable. Defaultwert
wäre blau und bei »desk_anzeige_open()« ein
onComplete (oder wie das bei Prototype heißt)
mitreinfummeln welches dann die momentane
Farbe vergibt und danach erst den »desk_ajax_spacer_02«
auf visible schalten...
onUnload kannst du die Variable dann in ein Cookie
schreiben und onload wieder auslesen falls vorhanden.
Und wg. Cookie setzen:
Das müsstes Du wenn dann schon als String ins
Cookie schreiben:
document.cookie = "eigenschaften('window','','backgroundImage','url(gfx/window_silver_bg.png)','DIV')";
aber dann haste mal viel Spaß beim auslesen
und wieder zurückzerstückeln - der wert kommt ja
wieder als String daher. Besser Du setzt eine Variable,
zB. document.cookie = "color=silver"; und verarbeitest
das dann weiter (s.o.)
|
|
| |
|
|
bluespoon
Threadersteller
Dabei seit: 10.11.2006
Ort: Hannover
Alter: 41
Geschlecht:
|
Verfasst Fr 20.07.2007 22:43
Titel Funktioniert (fast) |
|
|
Funktioniert (fast) ...
ich habe mir hier das Setzen und Lesen des Cookies abgeschaut:
http://forum.de.selfhtml.org/archiv/2005/10/t117007/
Die Funktion erweitert um den Wert "silber" zu schreiben:
| Code: | function farbe_silber() {
eigenschaften('window','','backgroundImage','url(gfx/window_silver_bg.png)','DIV');
eigenschaften('window_settings','','backgroundImage','url(gfx/window_settings_silver_bg.png)','DIV');
eigenschaften('start_bar','','backgroundImage','url(gfx/start_bar_silver.png)','DIV');
eigenschaften('start_menu','','backgroundImage','url(gfx/start_menu_silver_bg.png)','DIV');
writeCookie('myCookie', "silber" , 24);
} |
Und hiermit lade ich einfach ein zweites "Silber-Stylesheet":
| Code: | <script type="text/javascript">
var farbdesign=readCookie('myCookie')
if (farbdesign=="silber")
document.write('<link href="style/global_silber.css" rel="stylesheet" type="text/css" media="all" />')
else
document.write('')
</script> |
Ist ja ganz prima, das lässt sich dann ja auch mit else if erweitern ...
ABER: Ich muss die Seite ja reloaden, damit das Stylesheet wieder geladen wird. Da gibt
es auch keine andere Lösung für, gell!? Zumindest net um das Stylesheet im laufenden
Betrieb neu zu laden ..!?
Momentan müsste ich ja noch ein location.reload() hinzufügen, was aber den Nachteil hat,
dass sämtliche Inhalte auf der Seite verschwinden.
Zuletzt bearbeitet von bluespoon am Fr 20.07.2007 22:48, insgesamt 1-mal bearbeitet
|
|
| |
|
|
Raumwurm
Dabei seit: 21.12.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Fr 20.07.2007 23:23
Titel
|
|
|
Brauchst ja eigentlich nur ein bisserl was
umschreiben z.B. so in die Richtung:
| Code: | function setColorOnload() {
var farbdesign=readCookie('myCookie')
if (farbdesign=="silber")
{
var globalColor = farbdesign;
document.write('<link href="style/global_silber.css" rel="stylesheet" type="text/css" media="all" />');
} else {
var globalColor = 'blau'; // default
document.write('');
}
changeColor();
}
function changeColor(color);
if(color)
globalColor = color;
switch (globalColor) {
case "blau":
imgArr = ('url(gfx/window_bg.png)','url(gfx/window_settings_bg.png)','url(gfx/start_bar.png)','url(start_menu_bg.png)');
break;
case "silber":
imgArr = (...silberneBilder...);
break;
}
eigenschaften('window','','backgroundImage',imgArr[0],'DIV');
eigenschaften('window_settings','','backgroundImage',imgArr[1],'DIV');
eigenschaften('start_bar','','backgroundImage',imgArr[2],'DIV');
eigenschaften('start_menu','','backgroundImage',imgArr[3],'DIV');
}
window.onload = function () {
setColorOnload();
}
window.onunload = function () {
writeCookie('CookieFarbdesign', globalColor , 24);
}
|
Der Link zum farbwechseln gibt dann einfach die Farbe mit
<a href="javascript:changeColor('silber')" ...
|
|
| |
|
|
bluespoon
Threadersteller
Dabei seit: 10.11.2006
Ort: Hannover
Alter: 41
Geschlecht:
|
Verfasst Sa 21.07.2007 00:09
Titel ... noch nichts ... |
|
|
Ich habe das mal testweise in eine andere Datei gepackt.
Aber es tut sich gar nichts ... leider kann ich das Script nur schwer debuggen,
da ich nur zur Hälfte durchsteige. Auf jeden Fall schreibt er kein Cookie beim
Reloaden. Und er lädt auch keins beim Laden der Seite. Und der Echtzeitwechsel
der Stile bzw. Bilder findet auch net statt.
Ich bin gerade am Schauen, ob es net auch viel einfacher mit dem Framework von
Prototype funktioniert. Aber ich glaube, da werde ich net fündig ... aber abwarten 
|
|
| |
|
|
Raumwurm
Dabei seit: 21.12.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Sa 21.07.2007 11:10
Titel
|
|
|
Oh ich sehe gerade einen Fehler, das var müsste
auch weg vor den globalColor:
| Code: | function setColorOnload() {
var farbdesign=readCookie('myCookie')
if (farbdesign=="silber")
{
globalColor = farbdesign;
document.write('<link href="style/global_silber.css" rel="stylesheet" type="text/css" media="all" />');
} else {
globalColor = 'blau'; // default
document.write('');
}
changeColor();
} |
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
wo muss das global hin
css reset global o. differenziert
Ppt 2010: Schriftgröße global einstellen?
$_POST und/oder $_GET global abfragen ?
[javascript/dojo] [Update]: Global rpc-Callback registrieren
php.ini ändern
|
|
|
Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.
|
|
