JavaScript ist deaktiviert. Für eine bessere Darstellung aktiviere bitte JavaScript in deinem Browser, bevor du fortfährst.

Auf Thema antworten

Beitrag: [QUOTE="Lupus, post: 14142, member: 4692"] Das ist übrigens die antwort von [URL]https://chat.openai.com[/URL] : HTML <!DOCTYPE html> <html> <head> <title>Zufälliger Foto-Generator</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <div class="container"> <img id="randomImage" src="" alt="Zufälliges Foto"> <button onclick="changeImage()">Nächstes Foto</button> </div> <script src="script.js"></script> </body> </html> CSS body { display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; background-color: #f0f0f0; } .container { text-align: center; } img { max-width: 500px; border: 1px solid #ccc; border-radius: 5px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); } button { margin-top: 10px; padding: 10px 20px; font-size: 16px; background-color: #007bff; color: #fff; border: none; border-radius: 5px; cursor: pointer; } button:hover { background-color: #0056b3; } JS const images = [ 'image1.jpg', 'image2.jpg', 'image3.jpg', // Füge hier die Pfade zu deinen Bildern hinzu ]; function getRandomImage() { const index = Math.floor(Math.random() * images.length); return images[index]; } function changeImage() { const randomImageElement = document.getElementById('randomImage'); randomImageElement.src = getRandomImage(); } // Beim Laden der Seite wird das erste zufällige Bild angezeigt changeImage(); #################################################### Ersetze dabei die Bildpfade in der JavaScript-Datei mit den Pfaden deiner eigenen Bilder. Lade die Dateien in einem Ordner hoch und passe die Pfade entsprechend an. Damit sollte die Webseite bereit sein! Beim Laden der Seite wird ein zufälliges Bild aus der Liste der Bilder angezeigt, und wenn du auf den "Nächstes Foto"-Button klickst, wird ein neues zufälliges Bild angezeigt. [/QUOTE]

Authentifizierung