2011-01-20 4 views
1

저는 jQuery가 풍성하게 제공하는 애니메이션 기능을 사용하여 가로로 슬라이드하는 패널이 있습니다.jQuery IE6 딜레마 : 스크롤 왼쪽 또는 왼쪽 애니메이션?

문제는이 작은 응용 프로그램을 사용하게 될 클라이언트의 100 %가 IE6을 사용하고 있다는 것입니다. 패널에 몇 가지 요소가 포함되어 있기 때문에 너무 많지는 않지만 IE6과 느린 PC에서는 느릴 것입니다.

이제는 부모 항목을 스크롤하기 위해 scrollLeft를 움직여야하나요? 아니면 CSS 왼쪽 속성을 움직이는 자식 div 위치를 조정해야합니까?

다른 하나를 선택하면 성능이 향상됩니까? (나는 경험적 결정을 내릴 수있는 시점에 대상 PC에서 테스트 할 수 없습니다.)

감사합니다.

+1

일반적으로 성능을 향상시킬 수있는 요소가 적을수록 좋습니다. 가능한 한 경험적으로 가장 빠른 옵션을 선택하십시오. 그렇지 않으면 가장 적은 요소를 움직이는 옵션을 선택하십시오. –

+0

안녕하세요. Brian. 나는 슬프게 관련 기계에 그것을 시험 할 수 없다. 두 요소 모두 동일한 수의 요소가 이동하고 하나는 상위 콘텐츠 만 스크롤하고 다른 하나는 상위 콘텐츠를 다시 스크롤합니다. – Francisc

답변

3

대부분의 브라우저는 스크롤 할 때 전체 윈도우를 다시 그리지 않으므로 (더 낮은 컴퓨터의 경우 페이지가 아래로 스크롤 될 때 우스꽝스럽게 느려질 수 있기 때문에) scrollLeft에 애니메이션을 적용하면 성능이 향상됩니다. 브라우저가 다시 그리도록하십시오.

+0

좋은 대답, 고마워요. – Francisc

+0

이 정보를 어디서 얻었습니까? – Alvaro

+0

이전에 관찰했던 바로 그 관찰이었습니다. 이제는 컴퓨터가 더 빨라지고 (브라우저가 현재 최적화되었습니다) 눈에 띄지 않습니다. 여기서 하나의 벤치 마크 (http://jsperf.com/translate3d-vs-xy/13)가 지원되지만, 그 차이는 무시할 만해 보이며 translateX/Y를 사용하도록 알려줍니다. 브라우저를 다시 그리거나 리플 로우하는 것에 대한 더 많은 통찰력을 제공하는 또 다른 SO 응답 : http://stackoverflow.com/questions/2549296/whats-the-difference-between-reflow-and-repaint – Populus