반응형
jQuery 애니메이션 스크롤
효과를 호출하는 방법을 잘 모르겠지만 누군가가 웹 사이트와 동일한 효과를 내도록 도와 줄 라이브러리를 알려줄 수 있습니까?
기본적으로 마우스 클릭시 페이지 상단으로 행을 이동합니다. 코드 스 니펫, 가급적 jQuery는 특수 효과 라이브러리가없는 경우 도움이 될 수 있습니다.
다른 주제를 시작해야하는 것이 잘 모르겠지만 Makr UI의 전체 효과를 위해 작은 jQuery 스 니펫으로 나를 도울 수 있습니까?
jQuery를 사용하여 페이지의 스크롤 톱에 애니메이션을 적용 할 수 있습니다.
$('html, body').animate({
scrollTop: $(".middle").offset().top
}, 2000);
이 사이트를 참조하십시오 : http://papermashup.com/jquery-page-scrolling/
저가 개발 한 간단한 JQuery와 플러그인 ( AnimateScroll )을 사용해 볼 수도 있습니다 .
나는 단지 사용한다 :
$('body').animate({ 'scrollTop': '-=-'+<yourValueScroll>+'px' }, 2000);
var page_url = windws.location.href;
var page_id = page_url.substring(page_url.lastIndexOf("#") + 1);
if (page_id == "") {
$("html, body").animate({
scrollTop: $("#scroll-" + page_id).offset().top
}, 2000)
} else if (page_id == "") {
$("html, body").animate({
scrollTop: $("#scroll-" + page_id).offset().top
}, 2000)
}
});
이를 위해 jquery가 있습니다. 문서를 특정 요소로 스크롤하여 뷰포트의 중앙에 완벽하게 배치됩니다. 또한 스크롤 효과가 매우 부드럽게 보이도록 애니메이션 이징을 지원합니다. AnimatedScroll.js를 확인하십시오 .
참고 URL : https://stackoverflow.com/questions/8047454/jquery-animate-scroll
반응형
'ProgramingTip' 카테고리의 다른 글
C #에서`default` 키워드를 사용하는 것은 무엇입니까? (0) | 2020.11.06 |
---|---|
strcpy 대 memcpy (0) | 2020.11.06 |
SpannableStringBuilder는 여러 글꼴 / 텍스트 크기 등으로 많은을 생성합니다. 예? (0) | 2020.11.06 |
Intellisense는 Visual Studio 2012의 JavaScript에서 작동하지 않습니다. (0) | 2020.11.06 |
중단 / 종료 펼쳐 (0) | 2020.11.05 |