CSS - Pop-up-Bucheffekt


<style>
div.container {
perspective: 600px;
}
img.popup {
transform: rotateX(90deg);
transform-origin: bottom;
animation-delay: 0.5s;
animation-duration: 1s;
animation-iteration-count: infinite;
animation-direction: both;
animation-play-state: paused;
animation-name: popupanim;
outline: Solid 1px #000000;
cursor: Pointer;
}
img.popup:hover {
animation-play-state: running;
}
@keyframes popupanim {
from {
transform:rotateX(90deg);
}
to {
transform: rotateX(0deg);
}
}
</style>
<div class="container"> <img src="bild.png" class="popup"> </div>
<div class="container"> <img src="bild.png" class="popup"> </div>
Bausteine Alle Anzeigen
Eine zufällige Auswahl von Codeschnipseln
aus den Bereichen
HTML, CSS,
PHP, JavaScript und
MySQL.
<doctype> Dokumententyp
CSS - Drehende E-Mail - Problem gelöst!
JavaScript - Beim Anklicken einer Checkbox den dazugehörenden Text hervorheben