2012-01-10 4 views
3

요소 목록을 오버플로 스크롤하는 컨테이너를 만들었습니다. 요소를 클릭하면 이벤트가 트리거됩니다. 어떻게 확인할 수 있습니까? 요소가 완전히 보이고, 보이지 않으면 트리거 이벤트보다 요소가 완전히 보일 때까지 outter div 스크롤을 만듭니다.오버 플로우 스크롤에서 요소가 완전히 보이는지 확인 DIV

기본 css3 애니메이션과 일부 js를 함께 사용하여 스크롤하는 방법이 있습니까?

웹킷 브라우저, 특히 모바일 사파리에서만 작동해야합니다.

는 Heres는 지금까지 내 노력의 몇 가지 예제 코드 : 거기

http://jsfiddle.net/calebo/hywnc/

+0

확인이 질문 : https://stackoverflow.com/questions/123999/how-to-tell-if-a-dom-element-is-visible-in-the- 현재 뷰포트 .. 전체 뷰포트 대신 div에 채택하십시오. –

답변

0

당신은 이동 : http://jsfiddle.net/hywnc/17/

내가 스크롤/애니메이션에 대한 scrollTo 플러그인을 사용하고 있습니다; 오프셋이 10보다 큰 첫 번째 슬라이드를 찾으려는 오른쪽 슬라이드를 찾으십시오. 그리고 나서 나는 이전 것이 목표라고 가정합니다.

if ($this.offset().left >= 10) { 
    // Other logic 
    return false // Return false to stop the jQuery each method 
} 

행운

+0

안녕하세요, 저는 그것이 옳다고 생각하지 않습니다. 완전히 보이지 않는 네 번째 항목을 클릭해야 함), 왼쪽으로 스크롤/당겨 야합니다. 그러면 네 번째 항목이 완전히 보일 것입니다. 그런 다음 컨텐트 항목에 특정한 이벤트를 트리거합니다. – calebo

+0

다시 질문하십시오. 당신은 "클릭"이라는 단어를 언급하지 않습니다. 그것을 정확하게 다시 쓰면 나는 당신을 도울 것입니다. –