Mac 및 IOS Safari의 이상한 스크롤바 동작 (CSS/javascript)

Question

Mac 및 IOS Safari 스크롤바에서 정말 이상한 문제가 있습니다. Mac 및 IOS Safari에만 영향을 미치는 Google지도와 CSS 위치 정보 간의 일부 미친 상호 작용이있는 것으로 보입니다.

이 링크는 Windows의 Chrome, Firefox, Internet Explorer 및 Safari에서 정상적으로 작동합니다. http://ve.6k2cfrvt.vesrv.com/find-a-venue/

당신은 가지 문제의 아이디어를 얻을 수있는 페이지를 참조해야합니다

여기에 해당 페이지에 대한 링크입니다. 스크롤바는 Safari Mac에서 작동하지 않습니다. 스크롤바에 스타일을 추가 할 수 있도록 jScrollPane을 사용하고 있습니다. 디버깅을 꽤 많이했는데 사파리가 CSS "top"매개 변수를 올바르게 적용하지 못하는 것을 알 수 있습니다.

Google지도를 제거하는 경우. 문제는 사라집니다. (이 페이지는 일반적인 스크롤 막대를 가지고 있습니다 : http://ve.6k2cfrvt.vesrv.com/become-a-host/)

누구든지 솔루션에 대한 아이디어가 있습니까?

감사합니다.

Answer 1

결국 나는이 문제를 발견했습니다. Safari Mac이 너무 자주 그 CSS를 CSS를 통해 자바 스크립트를 통해 변경 요소를 다시 렌더링하지 않는 그 repainting을 최적화하는 것 같습니다.

간단한 솔루션입니다 :

//elem is a jQuery object 
if($.browser.safari) elem.addClass('repaint'); 
elem.updateCSSProperties(); 
if($.browser.safari) elem.removeClass('repaint'); 

이 추가 및 요소를 다시 칠하는 클래스 힘 사파리를 제거. 나는 이것이 누군가에게 유용하기를 희망한다.