Trapp: Bild über dem Bild vergrößern

Beitrag lesen

Hallo, wenn ich in dem nachfolgenden Beispiel über das Bild fahre, wird es neben dem Ursprungsbild vergrößert. Wie kann ich erreichen, dass es sich über dem Ursprungsbild öffnet? Danke für Eure Geduld.

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
<style>
.bilder_zoom{
position: relative;   
z-index: 0;
}

.bilder_zoom:hover{
background-color: transparent;
z-index: 50;
}

.bilder_zoom span{
position: absolute; float: left;
visibility: hidden;
/* color: black; */
text-decoration: none;
}

.bilder_zoom span img{ 
border-width: 0;

}

.bilder_zoom:hover span{
visibility: visible;
}

  </style>
</head>
 
<body>
<div>
    <a class="bilder_zoom">
    <img style="width: 100px; height: 67px;" src="bild.jpg" alt="Blumen" />
    <span><img src="bild.jpg" width="500" height="334" alt="Blumen" /></span></a>
</div>
</body>
</html>