2012-03-23 2 views
0

은 CSS3 전환 후 안드로이드 브라우저에서 강조하지. 모바일 Safari에서 링크가 예상대로 반투명 오버레이로 강조 표시됩니다. Android 브라우저 (테스트 된 2.1, 2.2, 2.3)에서는 링크를 클릭 할 수 있지만 강조 표시는 발생하지 않습니다. 실제로는 일반적으로 링크의 이전 위치를 클릭 한 채로 탭 강조 표시를 볼 수 있습니다. 여기링크 나는 다음과 같은 설정을 가지고

데모 : http://jsfiddle.net/bnickel/DmMZN/

결함 안드로이드 알려진 요소 위치에 대응하는 "접점"층을 가지고 있다는 것으로 나타나지만 CSS3 애니메이션 후 그 지점을 업데이트하지 않는다. 어떤 안전 터치 포인트가 제대로 업데이 트를 보장하는 방법이 있습니까? webkitAnimationEnd 콜백을 수행하면 문제가 없습니다.

답변

0

해결책은 간단합니다. 애니메이션이 끝나면 DOM 변경 이벤트를 트리거하면됩니다. 나는 다른 페이지 요소에 영향을 미치지 않을 정도로 충분히 포괄적이므로 다음을 사용합니다.

function fixTouchLayer() { 
    $('<span/>') 
     .css({ 
      position: 'absolute', 
      visibility: 'hidden' 
     }) 
     .appendTo(document.body) 
     .remove(); 
} 

http://jsfiddle.net/bnickel/DmMZN/5/