스크롤 막대 효과를 얻기 위한 js/jQ 메서드 요약

전에"HTML 페이지의 스크롤바 관련 설정 요약"이라는 글이 있었는데, 오늘은 CSS를 통해 스크롤바 스타일, 색상 등을 설정하는 방법을 주로 다루었습니다. JS/JQ를 통해:

1 .3차원 디지털 스크롤 막대를 추가하는 효과를 얻기 위해 jQuery를 사용하는 예

jquery를 사용하여 3차원 디지털 스크롤 막대를 추가하는 효과를 얻기 위해 코드는 다음과 같이 나뉩니다. 두 부분으로, 한 부분은 html 구조이고 다른 부분은 js 코드 세그먼트입니다. 필요하신 분들은 참고하시면 됩니다!

2.js를 통한 간단한 세로 스크롤바 구현

이 글에서는 주로 간단한 세로 스크롤바 구현을 위한 js의 샘플 코드를 소개하는데, 좋은 참고값을 가지고 살펴보도록 하겠습니다. the editor

3.커스텀 스크롤바를 캡슐화한 네이티브 js의 코드 케이스 공유

이 글은 주로 커스텀 스크롤바를 캡슐화한 네이티브 js 관련 지식을 소개합니다. 매우 좋은 참조 값을 가지고 있습니다. 아래 에디터를 살펴보겠습니다

최근에 온라인 뮤직 플레이어를 만드는 프로젝트가 있었는데 스크롤바를 사용해야 하는데 내장된 스크롤바가 너무 보기 흉해서 커스텀 스크롤 스트립을 생각해 봤습니다. .

4.jquery를 사용하여 외부 스크롤 막대의 스크롤을 금지하세요

일반적으로 내부 스크롤 막대가 양쪽 끝으로 스크롤되면 외부 스크롤 막대가 스크롤을 따르지만 때로는 사용자가 외부(창) 스크롤 막대를 트리거하지 않고 현재 영역만 스크롤할 수 있습니다. 현재 영역을 떠난 후 외부 스크롤 막대를 스크롤할 수 있습니다. 사용자가 실수로 너무 멀리 스크롤하여 현재 영역이 표시 영역을 벗어날 수 있기 때문입니다.

5.스크롤 막대가 아래쪽에 도달했는지 위쪽에 도달했는지 판단하는 jquery 메서드

$(document).height()  //是获取整个页面的高度
$(window).height()  //是获取当前也就是浏览器所能看到的页面的那部分的高度。这个大小在你缩放浏览器窗口大小时会改变，与document是不一样的

상단을 얻으려면 scrollTop()==0인 경우에만 상단을 얻으면 됩니다.

가져오려면 하단에서 스크롤Top()>=$(document).height()-$(window).height()를 확인하면 하단으로 스크롤되었음을 알 수 있습니다.

위 내용은 스크롤 막대 효과를 얻기 위한 js/jQ 메서드 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!