브라우저 세로 및 가로 스크롤 막대 사용 안 함
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">
지금까지 우리는 넘쳐납니다: 몸에 숨겨져 있습니다.그러나 IE가 항상 이를 준수하는 것은 아니며 본문 요소에도 스크롤="아니오"를 추가하거나 html 요소에도 숨겨진 위치 오버플로를 배치해야 합니다.
뷰 포트를 '제어'해야 할 때 이 기능을 추가로 수행할 수 있습니다.
<style>
body {width:100%; height:100%; overflow:hidden; margin:0; }
html {width:100%; height:100%; overflow:hidden; }
</style>
신체에서 100% 높이가 부여된 요소는 창 뷰포트의 전체 높이를 가지며, bottom:nnPX를 사용하여 절대적으로 배치된 요소는 창 하단 가장자리 위에 n픽셀이 설정됩니다.
CSS 해보세요.
수평을 제거하려는 경우
overflow-x: hidden;
Vertical을 제거하려는 경우
overflow-y: hidden;
최신 버전의 IE(IE10 이상)에서는 속성을 사용하여 스크롤 막대를 숨길 수 있습니다.
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");
IE에 스크롤바에 버그가 있습니다.따라서 둘 중 하나를 원하는 경우 다음을 포함하여 수평 스크롤 막대를 숨겨야 합니다.
overflow-x: hidden;
overflow-y:scroll;
수직으로 숨깁니다.
overflow-y: hidden;
overflow-x: scroll;
(아직은 언급할 수 없지만, 이 내용을 공유하고 싶었습니다):
데스크톱 브라우저에서 린시의 코드가 작동했습니다.하지만 아이패드(Chrome, iOS 9)에서는 애플리케이션을 다운시켰습니다.고치기 위해, 나는 바꿨습니다.
document.documentElement.style.overflow = ...
로.
document.body.style.overflow = ...
그것이 제 문제를 해결했습니다.
Firefox에는 화살표 키 바로 가기가 있기 때문에 다음과 같이 입력할 수 있습니다.<div>CSS 스타일로 주변:overflow:hidden;.
JQuery를 사용하여 다음 코드로 스크롤 막대를 비활성화할 수 있습니다.
$('body').on({
'mousewheel': function(e) {
if (e.target.id == 'el') return;
e.preventDefault();
e.stopPropagation();
}
});
또한 다음 코드를 사용하여 다시 활성화할 수 있습니다.
$('body').unbind('mousewheel');
언급URL : https://stackoverflow.com/questions/242608/disable-browsers-vertical-and-horizontal-scrollbars
'programing' 카테고리의 다른 글
| 기본적으로 일반 텍스트로 작은 모양의 붙여넣기를 만드는 방법 (0) | 2023.08.23 |
|---|---|
| Excel의 기본 ' 구분 기호' 변경 (0) | 2023.08.23 |
| 바인딩 요소 'index'에 암시적으로 '임의' 유형이 있음 (0) | 2023.08.23 |
| jQueryui 대화상자 제목 로드콜백 후 변경 (0) | 2023.08.18 |
| pk add --virtual 명령의 .build-deps란 무엇입니까? (0) | 2023.08.18 |