background-image ändern
joho
- css
0 Fabian St.0 Axel Richter0 joho
Hallo,
ich möchte eine Seite erstellen, bei der sich der Hintergrund per Link bzw. Auswahlliste ändert. Folgenden Quelltext habe ich für das Beispiel via Auswahlliste geschrieben:
*****
<html>
<head>
<title>farbe</title>
<style type="text/css">
<!--
body {
background-image: url(pattern1.gif);
}
-->
</style>
</head>
<body>
<FORM NAME="farbe">
<select name="test" onChange="document.body.style.background-image = (this.options[selectedIndex].value)">
<option value="url(pattern1.gif)" selected>pattern1
<option value="url(pattern2.gif)">pattern2
</select>
</FORM>
</body>
</html>
*****
Leider ändert es den Hintergrund nicht. Ich habe schon verschiedene andere Zeichensetzungen probiert und weiß keinen Rat mehr, da ich auf dem Gebiet noch nicht so bewandert bin.
Erkennt jemand von euch vielleicht den Fehler auf Anhieb? Ich wäre über Hilfe sehr dankbar.
Liebe Grüße!
Hi!
<FORM NAME="farbe">
<select name="test" onChange="document.body.style.background-image = (this.options[selectedIndex].value)">
^^
<option value="url(pattern1.gif)" selected>pattern1
<option value="url(pattern2.gif)">pattern2
</select>
Schau dir mal in der JavaScript-Objektrefernz die möglichen Werte für style an. Davon insbesondere den Satz:
"Eine wichtige Regel müssen Sie kennen: Wenn in einem Script eine CSS-Style-Sheet-Angabe ausgelesen oder verändert werden soll, entfällt der Bindestrich, und der erste Buchstabe des Wortes hinter dem Bindestrich wird großgeschrieben. Die CSS-Style-Sheet-Angabe background-color wird innerhalb eines JavaScripts also zu backgroundColor."
Grüße,
Fabian St.
Hallo,
<select name="test" onChange="document.body.style.background-image = (this.options[selectedIndex].value)">
Das style-Objekt hat keine Eigenschaft background-image
http://de.selfhtml.org/javascript/objekte/style.htm#style_eigenschaften.
Das Objekt document hat kein Unterobjekt body. Gib dem BODY-Element eine ID und verwende http://de.selfhtml.org/javascript/objekte/document.htm#get_element_by_id.
Woher kommt bei this.options[selectedIndex] die Variable selectedIndex. Du meinst sicherlich die Eigenschaft selectedIndex des SELECT-Elements http://de.selfhtml.org/javascript/objekte/options.htm#selected_index. Das ist bei Dir aber this, also this.options[this.selectedIndex].
viele Grüße
Axel
Hallo,
danke euch!
Hab's jetzt zumindest für die Link-Version hinbekommen.
MfG