Bild einblenden nach 10 Sekunden

  • Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

LittleBird

Neues Mitglied
2 Oktober 2018
3
0
1
21
Hallo Forum-Mitglieder,

ich möchte, dass auf meiner Website/Unterseite ein Bild nach 10 Sekunden eingeblendet wird.

Leider funktioniert dieser noch nicht so, wie ich will: 'png' steht hier für die Bildadresse

<html>
<head>
<script type="text/javascript">
function loadimg(id,time,src) {
setTimeout("document.getElementById('"+id+"').src = '"+src+"';",time);
}
</script>
</head>
<body onload="loadimg('bild1',10000,’png')">
<img id="bild1" width="301px" height="110px">
</body>
</html>

Desweiteren, da kann ich noch nicht sagen, ob das geht, da der obere Code noch nicht funktioniert - im Bild ist bereits ein Link enthalten, auf den der Anwender dann klicken kann.
Müsste ich da auch noch was programmieren?

Wer von Euch kann mir weiterhelfen?
 

LittleBird

Neues Mitglied
2 Oktober 2018
3
0
1
21
Klappt leider immer noch nicht. Ich sehe nur graue Ränder ohne Inhalt:

<html>
<head>
<script type="text/javascript">
function loadimg(id,time,src) {
setTimeout("document.getElementById('"+id+"').src = '"+src+"';",time);
}
</script>
</head>
<body onload="loadimg('bild1',10000,‘https://image.jimcdn.com/app/cms/im...1dfc2f8ff23bda28/version/1591384281/image.png‘)">
<img id="bild1" width="301px" height="110px">
</body>
</html>
 

LittleBird

Neues Mitglied
2 Oktober 2018
3
0
1
21
Hi,

ja das hatte ich zwischenzeitlich schon gesehen, aber daran lag es nicht.

Wenn ich deinen Code verwende, komme ich mit "https%3A%2F%2Fassets.codepen.io%2Finternal%2Favatars%2Fusers%2Fdefault.png&format=auto'"

nicht so ganz klar.

Gibt es noch ne andere Lösung?

Es sei noch erwähnt, dass das Bild auch einen Link enthalten muss, was da irgendwie rein soll. Habe leider nur Grundkenntnisse was HTML betrifft.
 

Sempervivum

Senior HTML'ler
18 Oktober 2016
1.913
370
83
67
Wenn da auch ein Link auf dem Bild liegen soll, würde ich eher empfehlen, das Ganze im HTML vorzubereiten und mit dem Javascript nur sichtbar zu machen:
Code:
<a id="das-bild-mit-link" href="dein-linkziel.html">
    <img src="die-url-deines-bildes.png">
</a>
<script>
    setTimeout(function() {
        document.getElementById('das-bild-mit-link').style.display = 'inline-block';
    }, 10000);
</script>
und am Anfang mit CSS unsichtbar machen:
Code:
#das-bild-mit-link {
    display: none;
}
(ungetestet)