Wie kann ich onmouseenter und onmouseleave dazu bringen, einen Bericht in Bezug auf ein Bild und nicht in Bezug auf das
Posted: 17 Jan 2025, 05:09
Betrachten Sie ein img, das in einem div enthalten ist. (Siehe Beispiel unten.) Ich möchte, dass onmouseenter und onmouseleave ausgelöst werden, wenn der Zeiger in ein Bild eintritt und es verlässt, aber stattdessen werden sie ausgelöst, wenn der Zeiger eindringt und verlässt. .. der Container des Bildes?!? Wie behebe ich das?
Dinge, die funktionieren, aber für meine Zwecke ungeeignet sind:
Dinge, die funktionieren, aber für meine Zwecke ungeeignet sind:
- width: 100%; aus dem Stil des Containers entfernen
- object-fit: include; im Stil des Bildes ändern
Code: Select all
function mouse_entered() {
console.log("mouse entered!")
}
function mouse_left() {
console.log("mouse left!")
}Code: Select all
.image-container {
width: 100%;
height: 100vh;
}
.image {
width: inherit;
height: inherit;
object-fit: contain;
}Code: Select all
[img]https://lh3.googleusercontent.com/-s05ILbxi6YA/AAAAAAAAAAI/AAAAAAAAACc/yAd6W8jNSBI/photo.jpg?sz=256[/img]
class="image"
onmouseenter="mouse_entered()"
onmouseleave="mouse_left()"
>