Zufallsbilder
macangelo
- html
Hi,
ich suche eine möglichst simple Möglichkeit, einen image-tag so auszustatten, das er aus einer Gruppe von Bildern nach dem Zufallsprinzip eins auswählt und einsetzt. Wenn Möglich ohne Datenbank. Wie gesagt, möglichst simple.
Hat jemand eine Idee? Schon mal besten Dank im Voraus.
Gruß
Macangelo
Hallo,
ich suche eine möglichst simple Möglichkeit, einen image-tag so auszustatten, das er aus einer Gruppe von Bildern nach dem Zufallsprinzip eins auswählt und einsetzt. Wenn Möglich ohne Datenbank. Wie gesagt, möglichst simple.
HTML kann sowas nicht. (Wie bereits 1000mal erwähnt hier.)
Am "einfachsten" geht das mit PHP, das aus einem Ordner Bilder auswählt und dann eins davon zurückgibt.
Gruß
Lachgas
Hallo Macangelo,
ich suche eine möglichst simple Möglichkeit, einen image-tag so auszustatten, das er aus einer Gruppe von Bildern nach dem Zufallsprinzip eins auswählt und einsetzt. Wenn Möglich ohne Datenbank. Wie gesagt, möglichst simple.
Hat jemand eine Idee? Schon mal besten Dank im Voraus.
Mit HTML alleine kommst du - wie N2O schon schrieb - nicht weit. Mit einer beliebigen Programmier-/Scriptsprache z.B. Javascript geht das am einfachsten, wenn du die Dateinamen der Bilder in einem Array speicherst und dann über eine Zufallszahl (gerundet und mit der Anzahl der Bilder-1 multipliziert) auf ein Arrayelement zugreifst. Dann gibst du einfach über document.write() den HTML-Code für das Bild aus und fertig (noscript-Element mit einem statischen Bild für die JS-losen nicht vergessen!). Da ich gestern erst sowas gebastelt habe, ausnahmsweise mal der fertige Code:
<script type="text/javascript">
var bilder = new Array(
'bootssteg.jpg',
'drachenboote.jpg',
'sattelplatz.jpg',
'vereinsgelaende.jpg',
'zweierrennen.jpg'
);
var anzahl = bilder.length;
var nr = Math.round(Math.random()*(anzahl-1));
document.write('<p><img src="'+bilder[nr]+'" width="500" alt="" /></p>');
</script>
<noscript>
<p><img src="sattelplatz.jpg" width="500" alt="" /></p>
</noscript>
thoretisch könnte man auch ein Bild einbinden und per document.images[x].src die URL ändern - das hätte aber den Nachteil, dass evtl. zwei Bilder geladen werden müssen.
Grüße aus Nürnberg
Tobias
Tobias,
var nr = Math.round(Math.random()*(anzahl-1));
Das ergibt folgende Wahrscheinlichkeiten:
bootssteg.jpg 1/8
drachenboote.jpg 1/4
sattelplatz.jpg 1/4
vereinsgelaende.jpg 1/4
zweierrennen.jpg 1/8
Wolltest du Gleichverteilung erreichen?
Gunnar
Wolltest du Gleichverteilung erreichen?
Dann nicht
var nr = Math.round(Math.random()*(anzahl-1));
sondern
var nr = Math.floor(Math.random()*anzahl);
Gunnar
PS. Ich gehe davon aus, dass Math.random() eine Zahl 0 ≤ x < 1 liefert.
http://javascriptkit.com/jsref/math.shtml#e1
Gibt's noch eine offizielle JS-Referenz? developer.netscape.com tut's nicht.
Hallo Gunnar,
Dann nicht
var nr = Math.round(Math.random()*(anzahl-1));
sondern
var nr = Math.floor(Math.random()*anzahl);
ich schwöre, das habe ich nicht gesehen, bevor ich mein Posting geschrieben habe :-)
PS. Ich gehe davon aus, dass Math.random() eine Zahl 0 ≤ x < 1 liefert.
http://javascriptkit.com/jsref/math.shtml#e1
laut http://de.selfhtml.org/javascript/objekte/math.htm#random@title=selfhtml ist das ebenfalls so.
Grüße aus Nürnberg
Tobias
Hallo nochmal,
laut http://de.selfhtml.org/javascript/objekte/math.htm#random@title=selfhtml ist das ebenfalls so.
*argh* ich wusste, dass das irgendwann schiefgehen würde, also hier nochmal ohne »ref«:
laut selfhtml ist das ebenfalls so.
Grüße aus Nürnberg
Tobias
PS. Ich gehe davon aus, dass Math.random() eine Zahl 0 ≤ x < 1 liefert.
http://javascriptkit.com/jsref/math.shtml#e1
laut selfhtml ist das ebenfalls so.
http://wp.netscape.com/eng/mozilla/3.0/handbook/javascript/ref_r-r.htm#194 sagt auch "between zero and one".
Wobei ich dem nicht ganz traue; meine Ahnung sagt: 0 kann kommen, 1 nicht.
Gunnar
Hallo Gunnar,
var nr = Math.round(Math.random()*(anzahl-1));
Das ergibt folgende Wahrscheinlichkeiten:
bootssteg.jpg 1/8
drachenboote.jpg 1/4
sattelplatz.jpg 1/4
vereinsgelaende.jpg 1/4
zweierrennen.jpg 1/8
Wolltest du Gleichverteilung erreichen?
öhh... da habe ich mir ehrlichgesagt noch keine Gedanken drüber gemacht. *schäm*
Ich habe mal etwas rumprobiert und bin - nach einigen erfolglosen Versuchen meine bisherige Zeile umzustellen - dann im Archiv auf Math.floor gestoßen, und damit:
var nr = Math.floor(Math.random()*anzahl);
bekomme ich jetzt die gleiche Häufigkeit:
0: 200294
1: 199868
2: 199468
3: 200825
4: 199545
(die Ergebnisse von 1000000 Schleifendurchläufen)
Danke für den Hinweis - wieder was gelernt :-)
Grüße aus Nürnberg
Tobias
Tobias,
var nr = Math.floor(Math.random()*anzahl);
Meine Rede. ;-)
Wobei ich nirgens gefunden hab, ob Math.random() nicht auch 1 liefern kann, dann gäb's ein Problem.
bekomme ich jetzt die gleiche Häufigkeit:
0: 200294
1: 199868
2: 199468
3: 200825
4: 199545
Was ist an den fünf _Häufigkeiten_ gleich?
Du bekommst die gleichen _Wahrscheinlichkeiten_ für jedes Bild.
Gunnar
Hallo Gunnar,
Wobei ich nirgens gefunden hab, ob Math.random() nicht auch 1 liefern kann, dann gäb's ein Problem.
stimmt, aber mein Testscript hat für 5 nie einen Wert ausgespuckt - ja, ich weiß man kann trotzdem nicht davon ausgehen, dass das immer so ist ...
Was ist an den fünf _Häufigkeiten_ gleich?
Du bekommst die gleichen _Wahrscheinlichkeiten_ für jedes Bild.
*argh* :-)
Grüße aus Nürnberg
Tobias
Was ist an den fünf _Häufigkeiten_ gleich?
Du bekommst die gleichen _Wahrscheinlichkeiten_ für jedes Bild.
*argh* :-)
Tobias,
Dass die Bilder gleich häufig auftreten, ist unwahrscheinlich.
Dass die Bilder gleich wahrscheinlich auftreten, ist dagegen häufig.
;-)
Gunnar