Hey!
Folgendes möchte ich umsetzen:
Ich möchte das ganze so <img class="vorschau" src="image/jwdnrt.png" alt="bild"> - Wenn ich mit der Maus über das Bild gehe soll das Bild wechseln, ca. so: <img class="vorschau" src="image/jwdo46.png">
Das geht auch soweit sehr gut, ich habe es bis jetzt so umgesetzt:
Code
<style>
mediaobergroup{
background-color: aliceblue;
}
.Instaaagran {
}
.Instaaagran:hover {
background: url(/image/1.png) no-repeat;
background-size:60px 80px;
background-position:center center;
}
.TWIIII {
}
.TWIIII:hover {
background: url(/image/2.png) no-repeat;
background-size:60px 80px;
background-position:center center;
}
.YYYTT {
}
.YYYTT:hover {
background: url(/image/3.png) no-repeat;
background-size:60px 80px;
background-position:center center;
}
.flex-container {
display: flex;
justify-content: center;
background-color: DodgerBlue;
}
.flex-container > a {
background-color: white;
width: 188px;
height:200px;
margin: 10px;
transition:all 2.0s;
font-size: 30px;
background-size:160px 180px;
background-position:center center;
}
</style>
<div class="flex-container">
<a class="Instaaagran" href="http://instagram.com/playgalaxy"></a>
<a class="TWIIII" href="http://twitter.com/playgalaxy_net"></a>
<a class="YYYTT" href="http://youtube.com"></a>
</div>