Skrollr는 화면의 크기를 조정 한 후에 만 ​​움직입니다.

Question

저는 고객의 웹 사이트에 Skrollr을 구현하고 있습니다. 다음과 같은 상대 위치를 사용하고 있습니다.

<div id="deer" data-anchor-target="#benchmark" data-200-bottom="left: -100px" data-bottom="left: 80px"></div> 

그러나 처음 페이지를로드 할 때 애니메이션이 작동하지 않는 것 같습니다. 하지만 화면 크기를 조정 한 후에 (예 : Firefox의 '반응 형 디자인보기'를 열거 나 방화 광구를 켜거나 끄기) 애니메이션이 제대로 작동하는 것처럼 보입니다.

이 문제는 Firefox (Mac) 및 Google 크롬 (Windows)에서 발생합니다. Chrome (Mac)에서이 문제는 사라집니다.

이 작업 데모를 살펴 보는 데 도움이됩니다. 나는 하루 종일 :( http://goo.gl/scFwV

Answer 1

해제 자바 스크립트를이 문제를 해결하고 페이지를 방문하기 위해 노력 해왔다 당신은 #benchmark 요소가 상단에 훨씬 더 가깝다 알 수 있습니다 이유는 간단하다.. 이미지 슬라이더 소요 공간,하지만 skrollr는 이런 일이 발생하기 전에 오프셋을 계산 귀하의 애니메이션이 실제로 실행에 있지만 동물 뷰포트를 입력하기 전에

결론 :.. 슬라이더가로드가 완료 될 때 skrollr.init 전화 아니면 refresh (https://github.com/Prinzhorn/skrollr#refreshelements)를 호출 할 수 있습니다..

Answer 2

Prinzhorn의 답변 주셔서 감사합니다. ame 문제를 해결하고 Flexslider-Container에 고정 높이를 설정하여 문제를 해결했습니다.