verschiedene Bilder bzw. Animationen zufällig durch Klick laden

J

jessies

Grünschnabel
Hallo!

ich habe ein Problem, was ich bisher noch nicht lösen konnte, da ich in diesem Bereich noch sehr frisch bin. Ich hoffe ihr könnt mir dabei weiterhelfen.

Mein Ziel ist es, diverse Bilder oder auch kleine Animationen, die ich in einem Ordner hinterlegt habe, durch klick auf einen Button immer zufällig neu zu laden. Das ganze sollte vorzugsweise noch in einer anderen Spalte bzw. Zeile einer Tabelle passieren. Hat jemand Vorschläge oder kann mir ein Stück weiterhelfen?

Vielen Dank schonmal für eure Hilfe und die investierte Zeit! :-)
 
Hi,

klar, sollte gehen, wenn Du die Bilder/Animationen fortlaufend nummerierst:
HTML: 
<script language="JavaScript" type="text/javascript">

var picName = "Image";
var picType = ".jpg";
var picCount = 20;

function newPic() {
	var num = parseInt(Math.random() * picCount) + 1;
	document.getElementById("pic1").src = picName + num + picType;
	document.getElementById("pic1").alt = picName + num + picType;
}

</script>

<body>
  <table width="50%" border="1">
    <tr>
      <td>
        <div align="center">
          <input name="button1" type="button" id="button1" value="Zufallsbild" onClick="newPic()">
        </div>
      </td>
      <td>
        <div align="center">
          <img id="pic1" name="pic1" src="" width="130" height="80" alt="" style="background-color: #999933">
        </div>
      </td>
    </tr>
  </table>
</body>
Wenn Dateien verschiedenen Typs geladen werden sollen (z.B. mal jpg, mal gif), kannst Du noch eine zweite Zufallszahl (zwischen 0 und 1) für die Dateieindung erzeugen lassen.

Gruß

.
 
Zuletzt bearbeitet:
Hallo Datic!

Vielen Dank für deine Hilfe. Ist genau das was ich mir vorstelle.
Funktioniert zwar in meinem Beispiel noch nicht 100 pro, aber ich hoffe, dass ich es noch hinbekommen werde.

Nochmal besten Dank und schönerlei Grüße!
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück