브라우저 스크롤 막대 높이와 ​​너비를 얻기 위한 js/jquery 사용에 대한 자세한 설명

브라우저 창의 표시 영역의 높이와 너비를 가져옵니다. 스크롤 막대의 높이가 필요한 친구는 참고할 수 있습니다.

IE에서는 다음과 같이 브라우저 표시 창 크기를 얻을 수 있습니다. 다음과 같이 코드를 복사하세요.

document.body.offsetWidth 
document.body.offsetHeight

DOCTYPE을 선언한 브라우저에서는 다음을 사용하여 브라우저 표시 창 크기를 얻을 수 있습니다. 다음과 같이 코드를 복사하세요.

document.documentElement.clientWidth 
document.documentElement.clientHeight

IE, FF, Safari는 모두 이 방법을 지원합니다. Opera는 이 속성을 지원하지만 페이지 크기를 반환합니다.
동시에 IE를 제외한 모든 브라우저는 이 정보를 window 개체에 저장합니다. 다음: 코드는 다음과 같습니다. 코드를 복사하세요

window.innerWidth 
window.innerHeight

전체 웹페이지의 크기를 구하는 일반적인 방법 코드는 다음과 같습니다. 코드를 복사하세요

document.body.scrollWidth 
document.body.scrollHeight

화면 해상도 높이를 구하는 일반적인 방법 코드는 다음과 같습니다. 코드 복사

window.screen.height 
window.screen.width

예제 요약

function getViewSizeWithoutScrollbar(){//不包含滚动条 
return { 
width : document.documentElement.clientWidth, 
height: document.documentElement.clientHeight 
} 
} 
function getViewSizeWithScrollbar(){//包含滚动条 
if(window.innerWidth){ 
return { 
width : window.innerWidth, 
height: window.innerHeight 
} 
}else if(document.documentElement.offsetWidth == document.documentElement.clientWidth){ 
return { 
width : document.documentElement.offsetWidth, 
height: document.documentElement.offsetHeight 
} 
}else{ 
return { 
width : document.documentElement.clientWidth + getScrollWith(), 
height: document.documentElement.clientHeight + getScrollWith() 
} 
} 
}

첨부된 내용은 전체 페이지의 너비와 높이를 얻는 가장 일반적으로 사용되는 방법입니다(jquery 프레임워크 필요)

$(document).width() < $(&#39;body&#39;).width() ? $(document).width() : $(&#39;body&#39;).width(); 
$(document).height() < $(&#39;body&#39;).height() ? $(document).height() : $(&#39;body&#39;).height();

alert($(window).height()); //浏览器时下窗口可视区域高度
alert($(document).height()); //浏览器时下窗口文档的高度
alert($(document.body).height());//浏览器时下窗口文档body的高度
alert($(document.body).outerHeight(true));//浏览器时下窗口文档body的总高度 包括border padding margin
alert($(window).width()); //浏览器时下窗口可视区域宽度
alert($(document).width());//浏览器时下窗口文档对于象宽度
alert($(document.body).width());//浏览器时下窗口文档body的高度
alert($(document.body).outerWidth(true));//浏览器时下窗口文档body的总宽度 包括border padding margin

alert($(document).scrollTop()); //获取滚动条到顶部的垂直高度
alert($(document).scrollLeft()); //获取滚动条到左边的垂直宽度

위 내용은 브라우저 스크롤 막대 높이와 ​​너비를 얻기 위한 js/jquery 사용에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!