Hover over table arrow while moving between cells

Question

I noticed some weird behavior in Chrome 15 and Safari regarding jquery hover events on tablerow.

What happens is that chrome triggers an off / on event when you move the mouse from one cell to another (on the same line). Since the binding is bound to a row in the table, I would expect on / off events to fire only when the row is moved / turned off.

Please see my JSFiddle .

In this example, move the mouse to the point where one cell ends and another begins (where the colors change).

Events seem to fire correctly in IE and Firefox, but not in Safari and Chrome. Maybe this is a bug in webkit?

Answer 1

I definitely think this is a problem with webkit (it makes sense as it is both chrome and safari).

I think I have a possible job, but there are some effects:

Change your css for td:

td { background-color: #e0dffe; border: none; padding: 10px; position:relative; left:-1px; } 

This leads to the fact that each td-element remains at 1 pixel, removing the extra 1px, which, apparently, inserts a web kit. As you will see, this causes a problem at your borders, so you will need to play around with your td: first-child, td: last-child css to get what you want in all browsers. I do not see an easy answer.