Mouseover Bilder Zoom mit HTML CSS Hover?

Hallo.

Ich möchte gerne wenn man auf das Bild geht mit der Maus, dass automatisch reingezoomt wird. Wie das geht und skaliert wird weiß ich. Da sich das Bild aber enorm vergrößern soll nimmt es die ganze Seite ein. Nun möchte ich, dass diese enorme Vergrößerung innerhalb eines Rahmens stattfindet, den ich definiere.

Ich probiere schon ein div drum herum zu legen und dies zu definieren, aber es klappt nicht. Hat schon mal jemand sowas gemacht und Beispielcode?

LG

Anja

Answer 1

[elmex7]

Da CSS beitet overflow dafür

Answer 2

[NoctusRex]

Evtl. hilft dir das weiter:

https://www.w3schools.com/howto/howto_css_zoom_hover.asp

Woher ich das weiß: Studium / Ausbildung – Ausbildung

Comments

[Bierprinzessin]

leider nicht. das ist der Zoom. das ist okay.

aber der zoom soll sich nur in einem definierten kästchen befinden. nicht die ganze website einnehmen.

ich habe halt bilder in die muss ganz weit reingezoom werde bzw. gehovert...aber die dürfen dabei nicht die ganze seite ausfüllen. kann man sagen dass dass ganze nur in einem kästen beipielsweise 100x300px passiert?

am besten du gehst mal auf die seite, dann siehst du es.

[Mats4411]

Ich vermute mal, du suchst soetwas:

https://www.revilodesign.de/blog/css-tricks/bilder-zoom-effekt-beim-hover/#:~:text=So%20funktioniert%20der%20Bilder%20Zoom%20Effekt&text=css%20Datei.,dabei%20nach%20belieben%20ge%C3%A4ndert%20werden.