어떻게이 슬라이딩 JS 모션을 만들 수 있습니까?

http://makr.com/에서이 동작을 만드는 방법을 찾는 데 어려움이 있습니다. 제품을 클릭하면 페이지가 슬라이드되고 더 많은 제품 정보가 나타납니다. 스크롤바는 또한 제품/정보가 전체 페이지에 맞는 곳으로 스크롤됩니다. 누군가 나를 도와 주거나 올바른 방향으로 나를 가리킬 수 있습니까?어떻게이 슬라이딩 JS 모션을 만들 수 있습니까?

출처

2013-09-01 user2736533

-1

은 scrollTo() 메소드를 사용합니다.

developer.mozilla reference.

출처

2013-09-01 23:17:50

w3schools를 참조하지 마십시오. [W3Fools - A W3Schools Intervention] (http://www.w3fools.com/) –

@ZebRawnsley 나는 일반적으로 –

w3schools가 악의적이며 해롭지 만 참조 용으로 좋았다. 대신 Mozilla Developer Network를 사용하십시오. [여기에 'window.scroll'과 MDN의 비슷한 메소드들에 대한 참조가 있습니다.] (https://developer.mozilla.org/en-US/docs/Web/API/window.scrollTo). -1 w3schools를 참조하십시오. – Tadeck

둘 다 jQuery를 사용하여 작업 할 수 있습니다. http://api.jquery.com/scroll/

일반적인 생각은 한 번 스크롤 방법을 실행할 수 있습니다 :이 페이지를 확인할 수 있습니다 를 들어 http://api.jquery.com/animate/

이 스크롤하십시오 개방 그들이가는 길에 제품에 대한

제품을 클릭 (원하는 위치로 스크롤)하고 애니메이션을 사용하여 제품 세부 정보를 엽니 다.

출처

2013-09-01 23:24:13

ul.products li.product 선택기가 목록의 모든 제품을 선택한다고 가정 해 보겠습니다. 의이 div.product-detail 선택이 대응 제품 상세 컨테이너 당신은 목적을 달성 특정 제품 상세 DIV (클릭 된 제품에 관련된 것)하지만,이 코드를 선택 할 수 있습니다

$(".ul.products li.product").click(function() { 

    $('div.product-detail').slideDown(function() { 
     $(window).scrollTop($(this).offset().top); 
    }); 
});

을 선택한다고 가정 해 봅시다.

offset 속성은 제품 세부 div의 위쪽/왼쪽 좌표를 제공합니다.

출처

2013-09-01 23:51:10

어떻게이 슬라이딩 JS 모션을 만들 수 있습니까?

답변

관련 문제