>웹 프론트엔드 >CSS 튜토리얼 >jQuery를 사용하여 Div에서 스크롤 막대 가시성을 어떻게 확인할 수 있습니까?

jQuery를 사용하여 Div에서 스크롤 막대 가시성을 어떻게 확인할 수 있습니까?

DDD
DDD원래의
2024-12-15 15:14:22664검색

How Can I Check for Scrollbar Visibility in a Div Using jQuery?

스크롤바 가시성 확인

요소의 오버플로는 jQuery를 사용하여 "auto"로 설정됩니다. 콘텐츠가 지정된 크기를 초과하면 이 속성은 스크롤 막대 모양을 트리거합니다.

해결책:

다양한 콘텐츠 길이와 그에 따른 가시성을 수용하려면 스크롤바를 사용하려면 사용자 정의 플러그인을 사용할 수 있습니다:

(function($) {

$.fn.hasScrollBar = function() {
    return this.get(0).scrollHeight > this.height();
}

})(jQuery);

사용법:

$('#my_div1'). hasScrollBar();
// 세로 스크롤 막대가 있으면 true를 반환하고, 그렇지 않으면 false를 반환합니다.

참고: 이 플러그인은 테스트를 거쳤으며 Firefox, Chrome, IE6, IE7에서 일관되게 작동합니다. 및 IE8. 그러나 본문 태그 선택기와 함께 제대로 작동하지 않을 수 있습니다.

가로 스크롤 막대에 대한 대체 솔루션:

가로 스크롤 막대로 인해 본문 태그 선택기가 나타나는 경우 수직 스크롤바의 경우, 앞서 언급한 기능이 제대로 작동하지 않을 수 있습니다. 대체 솔루션은 clientHeight 속성을 사용하는 것입니다.

return this.get(0).scrollHeight > this.get(0).clientHeight;

위 내용은 jQuery를 사용하여 Div에서 스크롤 막대 가시성을 어떻게 확인할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.