Wie vergrößere ich das erste Bild in einem CSS -Schieberegler? ⇐ HTML

[Anonymous]

Ich suche nach einer Möglichkeit, das erste Bild eines CSS -Schiebers zu vergrößern, wenn ich schwebe, aber wenn ich zum nächsten scrolle, wird das erste Bild klein und das nächste ist groß. Ab sofort vergrößert der Schieberegler nur ein Bild, wenn ich darauf klicke, aber ich möchte, dass der erste vergrößert wird, sobald ich die Seite öffne.

Code: Select all

[img]images/Phone Accessories/iwalkk.png[/img]
[img]images/Phone Accessories/Iwalk_C-removebg-preview.png[/img]
[img]images/Phone Accessories/jbl head.png[/img]

< /code>
  .container {
margin: 40px 0 0 50px;
width: 70%;
height: 50vw;
display: flex;
justify-content: center;
gap: 3%;
}
.container img {
width: 5%;
height: 100%;
object-fit: cover;
border-radius: 10px;
border: 1px solid transparent;
transition: all ease-in-out 0.5s;
}

.container img:hover {
width: 50%;
}