Bild vergrößern bei Mouseover
Verfasst: Fr 22. Mai 2020, 09:48
Hier ein Code mit dem man ein Bild vergrößern kann, indem man mit der Maus darüberfährt.
Hier der CSS-Code:
Hier der Code für die Seite:
Hier dazu eine Testseite: http://hapes-javascript-demo-page.hpage ... eover.html
Hier der CSS-Code:
Code: Alles auswählen
.image {
transition: transform 0.7s;
}
.image:hover {
transform: scale(2.5, 2.5);
}
#main {
background-color: transparent;
padding: 7px;
border: 1px dashed #b9821a;
margin: -100px 0 0 -200px;
position:absolute;
top: 50%;
left: 50%;
}
Code: Alles auswählen
<div id="main">
<img class="image" src="xyz.jpg" width="200px" height="200px">
</div>