[javascript] 브라우저 수직 및 수평 스크롤바 비활성화

Program / 글쓴이

jQuery 또는 javascript를 사용하여 브라우저의 수직 및 수평 스크롤바를 비활성화 할 수 있습니까?

답변

스크롤바를 동적으로 숨기고 표시 할 가능성이 필요한 경우 사용할 수 있습니다.

$("body").css("overflow", "hidden");

과

$("body").css("overflow", "auto");

코드 어딘가에.

답변

function reloadScrollBars() {
    document.documentElement.style.overflow = 'auto';  // firefox, chrome
    document.body.scroll = "yes"; // ie only
}

function unloadScrollBars() {
    document.documentElement.style.overflow = 'hidden';  // firefox, chrome
    document.body.scroll = "no"; // ie only
}

답변

CSS 사용해보기

<body style="overflow: hidden">

답변

지금까지 overflow : hidden on the body가 있습니다. 그러나 IE는 항상이를 존중하지 않으며 body 요소에도 scroll = “no”를 입력하거나 html 요소에도 overflow : hidden을 배치해야합니다.

뷰 포트를 ‘제어’해야 할 때 이것을 더 할 수 있습니다.

<style>
 body {width:100%; height:100%; overflow:hidden; margin:0; }
 html {width:100%; height:100%; overflow:hidden; }
</style>

body에서 높이가 100 % 인 요소는 창 뷰포트의 전체 높이를 가지며 bottom : nnPX를 절대적으로 사용하여 배치 된 요소는 창의 아래쪽 가장자리보다 nn 픽셀 위에 설정됩니다.

답변

CSS를 사용해보십시오.

수평을 제거하려면

overflow-x: hidden;

그리고 수직을 제거하려면

overflow-y: hidden;

답변

최신 버전의 IE (IE10 이상)에서는 -ms-overflow-style속성을 사용하여 스크롤바를 숨길 수 있습니다 .

html {
     -ms-overflow-style: none;
}

Chrome에서는 스크롤바의 스타일을 지정할 수 있습니다.

::-webkit-scrollbar {
    display: none;
}

이것은 웹 애플리케이션에서 ‘기본’본문 스크롤링을 사용하려는 경우 매우 유용합니다 overflow-y: scroll. 이는 .

답변

Internet Explorer 6에 대한 지원도 필요한 경우 html을 오버플로하십시오.

$("html").css("overflow", "hidden");

과

$("html").css("overflow", "auto");