javascript - html mouseover event on element border - Stack Overflow

admin管理员组

文章数量:1296457

I am wondering whether it is possible to bind mouseover event to one of the HTML element border, say, the left border of a div.

The div is a container for other plex html elements, and there are mouseover events attached for its sub elements. Binding mouseover event to the whole container div itself is a method, however the user will not be able to distinguish whether he select the container or the sub elements.

I want a very obvious method to indicate that the container can be selected, like highlighting the container when he mouseover the left border area.

Or is there any other good way to solve the problem?

Thank you.

I am wondering whether it is possible to bind mouseover event to one of the HTML element border, say, the left border of a div.

The div is a container for other plex html elements, and there are mouseover events attached for its sub elements. Binding mouseover event to the whole container div itself is a method, however the user will not be able to distinguish whether he select the container or the sub elements.

I want a very obvious method to indicate that the container can be selected, like highlighting the container when he mouseover the left border area.

Or is there any other good way to solve the problem?

Thank you.

• javascript
• html

Share Improve this question Follow edited Jun 6, 2012 at 10:04 BoltClock 724k165165 gold badges1.4k1.4k silver badges1.4k1.4k bronze badges asked Jun 6, 2012 at 6:46 George SunGeorge Sun 87111 gold badge1212 silver badges2020 bronze badges 3

• what do u mean?? bind a the border of a div with events..? – Philemon philip Kunjumon Commented Jun 6, 2012 at 6:50
• Why not simply change the colour, or style, of the border or cursor on mouseover? – David Thomas Commented Jun 6, 2012 at 6:53
• Hi David, What I want is to highlight left border when user mouseover left border area of the div, but not when user mouseover the whole div. – George Sun Commented Jun 6, 2012 at 7:26

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 7

Borders are not elements, and as such you cannot bind mouseenter events to them. If you wanted this type of functionality, you would need to place a series of elements around the edges of the element (or at least next to your target edge), and bind to that.

This particular approach was taken by Dropbox in their web-based upload feature. When you drag a file from your desktop onto their page, you'll notice that div elements around the top, bottom, and sides all fade into view. This was acplished with four div elements placed near the edges of the viewport.

do you want like this

http://jsfiddle/GBpcg/

EDIT : http://jsfiddle/GBpcg/2/

本文标签： javascripthtml mouseover event on element borderStack Overflow