元素边框上的 HTML 鼠标悬停事件

html mouseover event on element border

本文关键字:鼠标 悬停 事件 HTML 边框 元素      更新时间:2023-09-26

我想知道是否可以将鼠标悬停事件绑定到HTML元素边框之一,例如div的左边框。

div 是其他复杂 html 元素的容器,并且为其子元素附加了鼠标悬停事件。将鼠标悬停事件绑定到整个容器div 本身是一种方法,但是用户将无法区分他是选择容器还是子元素。

我想要一个非常明显的方法来指示可以选择容器,例如当他将鼠标悬停在左边框区域上时突出显示容器。

还是有其他解决问题的好方法?

谢谢。

边框不是元素,因此不能将 mouseenter 事件绑定到它们。如果需要这种类型的功能,则需要在元素的边缘周围(或至少在目标边缘旁边)放置一系列元素,并绑定到该元素。

Dropbox在其基于Web的上传功能中采用了这种特殊方法。当您将文件从桌面拖动到其页面上时,您会注意到顶部、底部和侧面周围的div元素都淡入视图。这是通过在视口边缘附近放置四个div元素来实现的。

你想要这样吗

http://jsfiddle.net/GBpcg/

编辑 : http://jsfiddle.net/GBpcg/2/