Bild erscheint nicht

  • Es hat im Testmodus funktioniert. Nachdem ich die Statments incl onmouseover in das eigentliche Programm kopiert habe, funktioniert es nicht mehr.
    Ich schicke hier den Code. Vielleicht sieht jemand auf den ersten Blick was ich falsch gemacht habe. Hoffentlich.
    LG
    Jochen


    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Lebe Smart</title>
    <link type="text/css" rel="stylesheet" media="screen" href="smartcss.css"/>


    <script>


    var BildListe = new Array();
    BildListe[0] = "bild0.png";
    BildListe[1] = "bild1.png";
    BildListe[2] = "bild2.png";
    BildListe[3] = "bild3.png";


    var Bilder = new Array()
    function Vorladen01() {for (i = 0; i < BildListe.length; i++) {Bilder[i] = new Image();Bilder[i].src = BildListe[i]; }}


    Vorladen01();


    function bildanzeigen(id) {document.getElementById("dasbild").src = Bilder[id].src;}


    function faerbe(id)
    {
    var farben = new Array('#aa3','#aa6','#aa9','#aac','#aaf','#abf');
    document.getElementById('container').style.backgroundColor=farben[id];
    }


    </script>


    </head>
    <body>


    <div id="wrapper">
    <header id="mainheader">
    <div id= "headerbild">
    <h2>Lebe Smart</h2>
    </div>
    </header>


    <ul id="navmenu">
    <li><a href="#">Home</a></li>
    <li><a href="#"onmouseover="bildanzeigen(0);">1.Styling</a>


    <ul class= "sub1">
    <li><a href="#"onmouseover="bildanzeigen(1);">Konzentrat</a>


    <ul class= "sub2">
    <li><a href="#">Aufwärmen</a></li>
    <li><a href="#">Heiß laufen</a></li>


    </ul>
    </li>
    <li><a href="#">usa</a></li>
    <li><a href="#">gbt</a></li>
    <li><a href="#">ko</a></li>


    </ul>
    </li>
    <li><a href="#">2.Styling</a></li>
    <li><a href="#">3.Styling</a></li>
    <li><a href="#">Spiel</a></li>
    <li><a href="#">Unterwegs</a></li>
    </ul>


    <div class="area-all">
    <div class="area-zero"> </div>
    <div class="area-one">


    </div>
    <div class="area-two"><img src="basis.jpg" alt=""></div>
    <div id="textfeld"> Bleib in Bewegung</div>
    </div>
    </div>
    </body>
    </html>

  • Crux in diesem Forum: Du müsstest Code-Tags verwenden, denn hier:

    JavaScript
    1. Bilder[i]

    wird das geklammerte i als BB-Code für italic interpretiert und verschluckt.
    Aber: Leider verschluckt das Forum beim Verwenden von Code-Tags die Zeilenumbrüche.

  • Ich denke, der Fehler liegt in der Vorladen-Funktion. Die Seite mit dem Beispiel hatte ich auch gefunden, weil mich die Zuweisung eines Bildes an ein Array stutzig gemacht hatte. Aber so sollte es funktionieren:


    edit:
    alte Version, nicht so schön:

    JavaScript
    1. function Vorladen01()
    2. {
    3. for(var i=0; i<BildListe.length; i++)
    4. {
    5. var Bild = new Image();
    6. Bild.src = BildListe[i];
    7. Bilder[i] = Bild;
    8. }
    9. }


    neue Version:

    JavaScript
    1. function Vorladen01()
    2. {
    3. var Bild;
    4. for(var i=0; i<BildListe.length; i++)
    5. {
    6. Bild = new Image();
    7. Bild.src = BildListe[i];
    8. Bilder[i] = Bild;
    9. }
    10. }

    Dieser Beitrag wurde bereits 2 Mal editiert, zuletzt von Jav ()

  • :) Ich habe es erfolgreich getestet. Bilder an ein Arry zuzuweisen funktioniert.



    var Bilder = new Array()
    function Vorladen01() {for (i = 0; i < BildListe.length; i++) {Bilder = new Image();Bilder[i].src = BildListe[i]; }}


    Vorladen01();


    Der Fehler im meinem Code war, dass ich das Bild in eine Klasse eingebunden hatte.


    Dank


    Jochen
    [/i][/i]