Zufallsgenerator für Bilder in einer css - Datei

Lufiki

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("

synaptic

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

Lufiki

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?

Tobse

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.

Lufiki

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

Tobse

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.

Lufiki

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

Tobse

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

Lufiki

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

Hier ist der komplette HTML Code:

</head>

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>

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.

Tobse

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

Lufiki

<!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>

</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??

Tobse

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";

synaptic

benutz doch bitte codetags um deinen code besser lesbar zu machen....

das is im editor des hier # für normalen code oder <> für html-code oder "php" eben für php-code

Tobse

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

synaptic

tobse, deine paar zeilen sind dabei nicht gemeint.. es geht mir da um bessere lesbarkeit seines codes.. bei dir hat man ja sogar als laie ne übersicht

Lufiki

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.

Tobse

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

Lufiki

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

synaptic

mach die fehlerkonsole beim firefox auf.... das wollte er gesagt haben

Tags