2010-04-21 4 views
2

iPad에서만 볼 수있는 웹 페이지에 일부 iPhone 스타일의 스크롤 관성을 추가하려고합니다.jQuery로 스크롤 관성을 구현하려고 시도합니다.

스크롤이 한 방향 (scrollLeft)에서 작동하지만 다른 방향으로 작동하지 않습니다. 그것은 아주 간단한 함수입니다.

function onTouchEnd(event){ 
       event.preventDefault(); 
       inertia = (oldMoveX - touchMoveX); 

       // Inertia Stuff 
       if(Math.abs(inertia) > 10){ 

        $("#feedback").html(inertia); 

        $("#container").animate({ 
         'scrollLeft': $("#container").scrollLeft() + (inertia * 10) 
        }, inertia * 20); 

       }else{ 

        $("#feedback").html("No Inertia"); 

       } 

      } 

나는 몸의 'touchend'이벤트에 묶었습니다. intertia는 터치가 끝나면 이전 moveX 위치와 최신 moveX 위치 사이의 차이입니다.

그런 다음 미리보기 이미지가 들어있는 div의 scrollLeft 속성에 애니메이션을 적용 해 봅니다. 앞서 말했듯이, 이것은 왼쪽으로 스크롤 할 때 작동하지만, 오른쪽으로 스크롤 할 때는 작동하지 않습니다.

아이디어가 있으십니까?

답변

4

"animate (...)"의 두 번째 인수는 음수가 아니어야합니다.

시도 :

... 
$("#container").animate({ 
     'scrollLeft': $("#container").scrollLeft() + (inertia * 10) 
    }, Math.abs(inertia * 20)); 
... 
+0

aaaaaaah! 감사 – gargantuan

관련 문제