유돌이

calendar

1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31

Notice

2019. 11. 14. 16:43 PHP/Java Script/html

[head]

<script src="http://code.jquery.com/jquery-latest.min.js"></script>

 

[css]

.point-in { color: red; font-weight:bold; }
.point-out { color: blue; font-weight:bold; }

 

[javascript]

function funcThisSize() {
    $(
"#innerWidth").html( window.innerWidth );
    $(
"#innerHeight").html( window.innerHeight ); $("#outerWidth").html( window.outerWidth );
    $(
"#outerHeight").html( window.outerHeight );
}

$(
function(){
    $(
window).resize( funcThisSize );
    funcThisSize();
});

[body]

<div>
    브라우저 화면 크기 :
<span id="innerWidth" class="point-in"></span> * <span id="innerHeight" class="point-in"></span>
</div>
<div>
    브라우저 전체 크기 :
<span id="outerWidth" class="point-out"></span> * <span id="outerHeight" class="point-out"></span>
</div>

[설명]

window.innerWidth : 브라우저 화면의 너비
window.innerHeight : 브라우저 화면의 높이
window.outerWidth : 브라우저 전체의 너비
window.outerHeight : 브라우저 전체의 높이
 

'PHP/Java Script/html' 카테고리의 다른 글

소스복사 / 마우스 우클릭 방지 모음  (0) 2019.11.14
[php] php date 함수 사용법  (0) 2019.11.06
[php] 문자열 역순으로 출력하기  (0) 2019.11.06
[PHP] extract() 란?  (0) 2019.11.06
strtotime 함수(php)  (0) 2009.05.19
posted by 유돌이