lufti: Hintergrundbild in Tabelle ändern?!?!

Hallo Leute,

ich hab eine Tabelle die sieht etwa so aus:

.
.
.
<table width="100%">
<tr> <td background="winter.JPG" onMousover="ChangePic()">Text</td> </tr>
</table>
.
.
.

ich möchte jetzt mit der Funktion ChangePic() das Bild ändern - nur weiß ich nicht wie ich das mit JavaScript machen kann?? Ich hab ja keine Variable src die ich ändern könnte!?!?!

Vielen Dank im voraus!!
schönen Tag noch

  1. hi,

    <tr> <td background="winter.JPG" onMousover="ChangePic()">Text</td> </tr>

    pfui bah.
    schmeiss das html-attribut background raus, und weise stattdessen das hintergrundbild per CSS zu.

    ich möchte jetzt mit der Funktion ChangePic() das Bild ändern - nur weiß ich nicht wie ich das mit JavaScript machen kann??

    CSS-eigenschaften dynamisch per javascript ändern: <selfhtml.teamone.de/javascript/objekte/style.htm>

    gruss,
    wahsaga

  2. hi

    Ich hab ja keine Variable src die ich ändern könnte!?!?!

    • nimm CSS um das hintergrundbild in die zelle zu bekommen.
    • gib der zelle eine ID
    • nutze "getElementById" und "style" (beides Javascript!) um das bild auszutauschen

    so long
    ole
    (8-)>

    1. Hi hab leider immernoch probleme :o(

      hab jetzt im head im script-bereich stehen:

      .
      .
      .
      function change(){
      document.getElementByID("h")[0].style.background = "girlsevil.JPG";
      }//endfunction
      .
      .
      <body>

      <table>
      <tr><td id="h" style="background:url(winter.JPG)" onMousover="change()">Text</td></tr>
      </table>

      </body>

      Funktioniert leider immernoch nicht - vertauscht nicht das bild - hab ich was falsch gemacht?? ist [0] richtig??

      1. hi

        Hi hab leider immernoch probleme :o(

        kann ich verstehen, hast ja auch einige fehler drin

        function change(){
        document.getElementByID("h")[0].style.background = "girlsevil.JPG";
        }//endfunction

        Javascript ist casesensitive, achte auf die schreibweise

        getElementById spricht genau ein Element an, da ID einmalig sein müssen. [0] ist daher auch nicht korrekt.

        außerdem solltest du das hintergrund bild austauschen
        http://selfhtml.teamone.de/javascript/objekte/style.htm#style_eigenschaften

        <table>
        <tr><td id="h" style="background:url(winter.JPG)" onMousover="change()">Text</td></tr>
        </table>

        du solltest dir nochmal anschauen wie hintergrundbilder via CSS definiert werden.

        so long
        ole
        (8-)>

        1. Hi nochmal - hab befolgt was du gesagt hast, aber ich komm leider einfach nicht weiter - er bringt eine Fehlermeldung(ungültiges argument) - wenn ich die Hintergrundfarbe wechseln möchte klappt es NUR bei den Bildern nicht und glaub mir ich hab mir die beschreibung schon 10x durchgelesen :o(

          function change(){
          document.getElementById("h").style.background-image = "winter.JPG";
          }//endfunction

          <tr><td id="h" style="background-image:url(winter.JPG)" >Text</td></tr>

          bitte sagt mir wenn euch der Fehler auffällt!!
          thx

          1. Hi lufti,

            dann probier's mal so ...

            document.getElementById("h").style.background = "url(winter.JPG)";

            LG, piranja

            1. hi

              dann probier's mal so ...

              document.getElementById("h").style.background = "url(winter.JPG)";

              nein, das ist falsch, korrekt wäre die verwendung von "backgroundImage".

              so long
              ole
              (8-)>

              1. hi,

                document.getElementById("h").style.background = "url(winter.JPG)";

                nein, das ist falsch, korrekt wäre die verwendung von "backgroundImage".

                wieso sollte das falsch sein?

                CSS erlaubt es durchaus, mehrere unterschiedliche angaben zum hintergrund mit background zusammenzufassen.

                (allerdings könnte es u.U. nicht dem gewünschten entsprechen, da auf diesem wege alle anderen background-eigenschaften mit ihren default-werten überschrieben werden.)

                gruss,
                wahsaga

            2. Yeah!!! DAAAAAANKE *freu*

          2. hi

            function change(){
            document.getElementById("h").style.background-image = "winter.JPG";
            }//endfunction

            der fehler steckt hier in der zweiten zeile
            schau die nochmal http://selfhtml.teamone.de/javascript/objekte/style.htm#style_eigenschaften und korrigiere deinen fehler. Tip: achte auf den Bindestrich und die schreibweise :)

            so long
            ole
            (8-)>