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

Frage Bilder unterschiedliche Zeitdauer ein-/ausblenden

C

crusico

Mitglied
Hi to @ll,

wie kann man z.B. 5 Bilder unterschiedlich nacheinander ein-/ausblenden?

Also:
Bild1 -> 10 sec einblenden, danach ausblenden es folgt
Bild2 -> 20 sec einblenden,danach ausblenden es folgt
Bild3 -> 5 sec einblenden,danach ausblenden es folgt
Bild4 -> 20 sec einblenden,danach ausblenden es folgt
Bild5 -> 10 sec einblenden,danach wieder von vorne.
 
Werbung:
Danke, ich schaue mir das grade an... mit CSS keyframe bekomme ich zwar ein Bild ein und ausgeblendet, aber nicht so wie ich das vorhaben :-( Wie bekomme ich jetzt das zweite rein, genau auf die Position wo das erste Bild stand?

<!DOCTYPE html>
<html>
<head>
<style>
@keyframes NAME-YOUR-ANIMATION {
0% { opacity: 0; }
100% { opacity: 1; }
}
#box {
animation: NAME-YOUR-ANIMATION 5s infinite; /* IE 10+, Fx 29+ */
animation-fill-mode: NAME-YOUR-ANIMATION backwards; /* or: backwards, both, none */
}
</style>
</head>
<body>
<div>
<img src="Reiter1.png" id="box" >
</div>
</body>
</html>
 
Werbung:
https://jsfiddle.net/Aaron3219/f2L9vLww/12/

Hier mal ein Beispiel.
Ich schätze mal, dass du Fragen haben wirst, also schau es dir bitte genau an, anstatt zu kopieren und stelle deine Fragen dementsprechend.

Probier ein bisschen rum und veränder mal ein paar CSS-Attribute, vielleicht klären sich dadurch schon ein paar Fragen.
 
Hi,

danke für die Hilfe, ich habe das jetzt anders gelöst mit
new Image()
function neuesbild () { document.images[0].src = Bild.src; }
und
setTimeout(neuesbild, 3000)
 
Werbung:
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben