元素边框上的html鼠标悬停事件答案

【问题标题】：html mouseover event on element border元素边框上的html鼠标悬停事件
【发布时间】：2012-06-07 12:21:15
【问题描述】：

我想知道是否可以将 mouseover 事件绑定到 HTML 元素边框之一，例如 div 的左边框。

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

我想要一个非常明显的方法来表明容器可以被选中，比如当他将鼠标悬停在左边框区域时突出显示容器。

或者有没有其他的好办法来解决这个问题？

谢谢。

【问题讨论】：

【解决方案1】：

边框不是元素，因此您不能将 mouseenter 事件绑定到它们。如果您想要这种类型的功能，则需要在元素的边缘周围（或至少靠近目标边缘）放置一系列元素，然后绑定到该元素。

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

【讨论】：

【解决方案2】：

你想要这样吗

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

【讨论】：