2011-11-16 4 views
4

tablerow에서 jquery hover 이벤트와 관련하여 Chrome 15 및 Safari에서 이상한 동작을 감지했습니다.셀 사이를 이동할 때 표 행에서 마우스를 놓을 때

무슨 일이 일어나고있는 건 내 마우스를 한 셀에서 다음 셀로 이동시킬 때 (같은 행에있는 동안) 크롬이 꺼짐/켜짐 이벤트를 실행하고 있다는 것입니다. 호버가 테이블 행에 부착되어 있으므로 행을 켜고 끌 때 켜기/끄기 이벤트 만 발생하는 것으로 예상됩니다.

JSFiddle을 참조하십시오.

예를 들어, 한 셀이 끝나고 다른 셀이 시작되는 지점으로 마우스를 이동하십시오.

IE 및 Firefox에서는 Safari 및 Chrome이 아닌 이벤트가 올바르게 실행되는 것 같습니다. 어쩌면 웹킷의 버그일까요?

답변

2

분명히 이것이 웹킷의 문제점이라고 생각합니다. 크롬과 사파리 모두 그렇듯이 말이됩니다.

는 내가 주위에 가능한 일이 생각하지만, 효과에 대한 몇 가지 노크있다 :

는 TD 대한 CSS를 변경

:

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

이 1 픽셀 씩 왼쪽 각 TD 요소를 밀어하는 효과가있다는 웹킷이 삽입하는 여분의 1 픽셀을 제거합니다. 보시면 알 수 있듯이 국경에 문제가 생기므로 모든 브라우저에서 원하는 것을 얻으려면 td : first-child, td : last-child CSS를 가지고 놀아야합니다. 나는 쉬운 대답을 볼 수 없다.

+0

감사합니다. PJ42, 위치를 오프셋하는 것에 대해 생각하지 않았습니다. 여러분이 말한대로, 이것을하면 노크 효과가 발생합니다. 즉 1px가 행의 끝으로 밀려납니다. 어쨌든이 시점에서 마우스가 tr에서 빠져 나오기 때문에 이것이 아마도 더 좋은 해결책이라고 생각합니다. –

+0

제 경우에는이 솔루션이 정상적으로 작동했습니다. 그것은 더러운 더러운 해킹입니다.) –

관련 문제