joho: background-image ändern

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!

  1. 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.

    --
    Meine Website: http://fabis-site.net
    --> XHTML, CSS, PHP-Formmailer, Linux
    ---------------------
    fabi@erde ~# whatis spam
    spam: nothing appropriate
    ---------------------
    Selfcode: ie:% fl:|  br:^ va:) ls:& fo:) rl:( n4:° ss:| de:> js:| ch:| mo:) zu:)
  2. 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

  3. Hallo,

    danke euch!
    Hab's jetzt zumindest für die Link-Version hinbekommen.

    MfG