Accurately detect mouseover event for a div with rounded corners

Question

I am trying to detect a mouseover event on a circle. I define the circle div like this:

.circle {
  width: 80px;
  height: 80px;
  -moz-border-radius: 40px;
  -         


        

Answer 1

No, there is not. Think in geometrical terms. You're still using a div, which is a box element. That box element has a specific rectangular boundary that triggers the mouse over event. The use of CSS to supply a rounded border is cosmetic only, and does not change the rectangular boundary of that element.