Zufallsgenerator für Bilder in einer css - Datei

    Habe jetzt diesen alten Thread entdeckt.

    Ich würde gerne auf einer HTML Seite dass jedes Mal ein Bild ausgetauscht wird; allerdings liegt dieses nicht im Body, sondern das auszutauschende Bild liegt in einer Tabelle, zum Beispielt
    Wie müsste hier das Script dann aussehen?
    Das liegt natürlich im Javascript tag, aber es soll sich eben nicht auf den Body sondern auf die img source in der Tabelle beziehen.
    Ich krieg das leider nicht hin. Da müsste ja irgendwo ein Pfad zum img sein?

    function zufallszahl(n){
    zahl = Math.floor(Math.random()* (n+1));
    return zahl;
    }

    var bild = new array();

    bild[0] = "image1.jpg"
    bild[1] = "image2.jpg"
    bild[2] = "image3.jpg"
    bild[3] = "image4.jpg"

    document.write("

    die pfade sind im array enthalten...
    gib mal vor was du an code hast dann kann man dir sagen was wo zu tun ist...
    und javascript is nich böse, du kannst dich gern mal damit auseinandersetzen :)

    Danke erstmal für Deine Antwort!
    Das wäre der code. Ich kann das leider nicth selbst scripten, bin da völlig planlos.
    Der Pfad zu den Bilder ist im Array, richtig, also in dem Fall dann
    "images/bildname.gif"

    Ich meinte aber noch, woher weiss das Script überhaupt, wo es was austauschen muss? Ich habe halt in dem Fall eine table / tr / td
    und dann img src="images/bildname.gif"

    Wie stellt sich die Verbindung zu dem Javascript Code her, damit dieser weiss was er austauschen soll?

    Für mich sieht das nur nach dem Austauschscript aus, aber irgendwo fehlt doch der Bezug?

    Da hast du recht, JS weiss das norgendwoher.
    In deine Script-tags kommt:

    Code
    function zufall(n) {
zahl = Math.floor(Math.random()* (n+1));
document.getElementById('navibild').background="image"+zahl+".jpg";
}


    und dein navi-div bekommt als id navibild und das src setzt du am anfang auf z.B. navi.jpg, falls jemand JS aus hat.
    Dann muss noch in den body-tag

    HTML
    onload="zufall(4);"


    und dann wars das.

    Der, der weiß dass er nichts weiß, weiß mehr als der, der nicht weiß, dass er nichts weiß.

    Wer nach etwas fragt, geht grundsätzlich das Risiko ein, es auch zu bekommen!

    Sorry, jetzt bin ich verwirrt :)
    Kommt das zusätzlich in das oben genannte Script oder statt dessen?


    onload="zufall(4);"

    Und das kommt dann dorthin wo sich das auszutauschende Bild befindet? Also in dem
    Fall ist es nicht die Navi, sondern ein Bild im Hintergrund, aber auch nicht im body tag.

    Sorry... bin ne Frau...das dauert etwas länger.. :)

    So halb.
    das
    onload="zufall(4);"
    kommt nach <body>, also
    <body onload="zufall(4);">
    und in den Bereich in dem das Hintergrundbild ausgetauscht werden soll kommt
    id="navibild"
    (Das sollte doch für die navi sein, oder?)
    Und das JavaScript da oben kommt anstatt rein.

    Der, der weiß dass er nichts weiß, weiß mehr als der, der nicht weiß, dass er nichts weiß.

    Wer nach etwas fragt, geht grundsätzlich das Risiko ein, es auch zu bekommen!

    Nicht die Navi, oben rechts, quasi wie ein Logo.

    Warum steht in der Klammer des on load tags zufall(4) eine 4. Ist das
    egal, kann da auch 1 stehen??

    Und wo, äh...weiss JS welche Bilder genommen werden sollen?

    Hier: "image"+zahl+".jpg"; ?
    Also die heissen meinetwegen Image1.jpg, Image2.jpg usw...

    Achso, das hab ich aber nicht beantwortet bekommen: kommt der andere JS code komplett raus oder nur der neue zusätzlich rein
    (Ich meine den, kommt der raus?)
    function zufallszahl(n){
    zahl = Math.floor(Math.random()* (n+1));
    return zahl;
    }

    var bild = new array();

    bild[0] = "image1.jpg"
    bild[1] = "image2.jpg"
    bild[2] = "image3.jpg"
    bild[3] = "image4.jpg"

    document.write("

    Wie gesagt - Frau; schwer von (Programmier)Begriff...

    der in deinem Post muss raus, meiner rein.
    und das element, indem der Hintergrund geändert werden soll bekommt
    id="navibild"

    Der, der weiß dass er nichts weiß, weiß mehr als der, der nicht weiß, dass er nichts weiß.

    Wer nach etwas fragt, geht grundsätzlich das Risiko ein, es auch zu bekommen!

    Sorry, hab Deine Antwort überlesen und entsprechend geändert. Klappt aber trotzdem nicht.

    Hier ist der komplette HTML Code:

    </head>

    <body bgcolor="#FFFFFF" onload="zufall(4);">
    <script language="Javascript">

    function zufall(n) {
    zahl = Math.floor(Math.random()* (n+1));
    document.getElementById('start').background="image"+zahl+".gif";
    }

    </script>
    <table align="right"><tr><td ><img src="images/webopen1.gif" border="0" usemap="#Map" id="start"/></td>
    </tr>

    </table>

    <map name="Map" id="Map"><area shape="rect" coords="613,429,740,464" href="#" /></map></body>
    </html>

    Die Bilder liegen in einem Ordner "images" auf der gleichen Ebene wie diese index.html

    background="image"+zahl+".gif"; - muss da bei image der Name der ersten Datei rein oder nicht? Habe aber beides
    ausprobiert, funktioniert beides nicht.

    Einmal editiert, zuletzt von Lufiki (20. Januar 2010 um 16:23)

    das <script>-Tag muss in den Head. background="image"+zahl+".gif"; musst du dann entsprechend mit
    background="images/image"+zahl+".gif"; ersetzen.

    Der, der weiß dass er nichts weiß, weiß mehr als der, der nicht weiß, dass er nichts weiß.

    Wer nach etwas fragt, geht grundsätzlich das Risiko ein, es auch zu bekommen!

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <script language="Javascript">

    function zufall(n) {
    zahl = Math.floor(Math.random()* (n+1));
    document.getElementById('start').background="images/webopen1 "+1+".gif";
    }

    </script>
    <title>Unbenanntes Dokument</title>
    </head>

    <body bgcolor="#FFFFFF" onload="zufall(4);">

    <table align="right"><tr><td ><img src="images/webopen1.gif" border="0" usemap="#Map" id="start"/></td>
    </tr>

    </table>
    <map name="Map" id="Map"><area shape="rect" coords="613,429,740,464" href="#" /></map></body>
    </html>

    Das JS war am falschen Platz, stimmt. Aber woher weiss JS überhaupt, wie viele Bilder dann in dem Images Ordner liegen. In dem anderen Script gab es ja ein Array, in dem die Bilder gelistet waren.

    Ich check das nicht, ich glaub langsam ich bin echt zu blöd.

    background="images/webopen1 "+1+".gif";

    Stimm das jetzt so??

    nein, stimmt nicht.
    die zahl in den kalammern (4) ist die anzahl der bilder, die in deinem ordner liegen. mach aus
    background="images/webopen1 "+1+".gif";
    wieder
    background="images/image"+zahl+".gif";

    Der, der weiß dass er nichts weiß, weiß mehr als der, der nicht weiß, dass er nichts weiß.

    Wer nach etwas fragt, geht grundsätzlich das Risiko ein, es auch zu bekommen!

    Wenn ich gemeint bin tuts mir leid, dachte wegen den paar zeilen seis kein ding....

    Der, der weiß dass er nichts weiß, weiß mehr als der, der nicht weiß, dass er nichts weiß.

    Wer nach etwas fragt, geht grundsätzlich das Risiko ein, es auch zu bekommen!

    Er...ist eine Sie! Stand ja im Text.

    Also es geht nicht! Hab es so geändert.
    Ist die ID an der falschen Stelle? Nein, kanns auch nicht sein, hab sie schon vor img src gestellt, auch in die tc. Es geht einfach nicht!
    Ist das was, das nur mit dem IE funktioniert. Sorry, bin MAC User mit Firefox und Safari.
    Es ist immer nur das gleiche Bild geladen.

    mach mal STRG+SHIFT+J und da müssten ein paar weiterführende dinge stehen. (FF)

    Der, der weiß dass er nichts weiß, weiß mehr als der, der nicht weiß, dass er nichts weiß.

    Wer nach etwas fragt, geht grundsätzlich das Risiko ein, es auch zu bekommen!

    STRG gibts am Mac nicht...heisst bei uns CTRL.

    mach mal STRG+SHIFT+J und da müssten ein paar weiterführende dinge stehen. (FF)

    Wann soll ich das drücken? Bitte nicht in Rätseln sprechen...