'JavaScript'에 해당되는 글 2건

  1. 2011.12.02 브라우저의 각종 크기
  2. 2011.04.25 ModalDialog 사용 시의 주의점
JavaScript2011. 12. 2. 14:22
scrollWidth,scrollHeight 는 창의 크기가 아니라 문서의 크기입니다.
브라우저의 "보이는 영역" 과 "보이지 않는 영역"(스크롤해야 볼 수 있는) 을 합한 것으로
스크롤바를 움직여 볼 수 있는 모든 영역의 크기입니다.

"보이는 영역" 만 구하려면 clientWidth,clientHeight 를 사용합니다.
이들은 padding은 포함하고, margin, border, scrollbar는 포함하지 않는 크기입니다.

offsetWidth, offsetHeight 는 padding, border, scrollbar 를 포함한 크기죠

이들의 대소 관계는 이렇게 됩니다
offsetWidth >= clientWidth
scrollWidth >= clientWidth
offsetWidth >=< scrollWidth

[ test it ! ]
<div style='width:150%;height:150%;'>
<span onClick="window.resizeTo(500,500)">resizeTo(500,500)</a>
<span onClick="alert(document.body.clientWidth)">clientWidth</a>
<span onClick="alert(document.body.offsetWidth)">offsetWidth</a>
<span onClick="alert(document.body.scrollWidth)">scrollWidth</a>
</div>


모바일웹에서의 HTML5의 기능: http://blog.daum.net/kkjjww1027/750

'JavaScript' 카테고리의 다른 글

ModalDialog 사용 시의 주의점  (0) 2011.04.25
Posted by iWithJoy
JavaScript2011. 4. 25. 17:42

ModalDialog 사용 시의 주의점

일반 팝업창이 아래와 같다면
szGroupUserSelectionURL = "javascript:popup( '" + szGroupUserSelectionURL + "', 'SelectOwnerURL', '570', '550', 'NO', 'NO');";
모달창은
szGroupUserSelectionURL = "javascript:window.showModalDialog('" + szGroupUserSelectionURL + "', self ,'dialogWidth:580px;dialogHeight:580px;scroll:0;help:0;status:0');";
이렇게 window.showModalDialog로 뛰워주면 됩니다.
 
형식은 팝업창과 거의 유사하지만 유의해야 할 점이 있습니다.
 
1. 스크립트 호출문제
모달창에서는  href="javascript:스크립트명();" 이런식으로 호출해서 쓰면 브라우저에 스크립트명이 뜨고 원하는 액션이 일어나지 않습니다.
그래서 모달창으로 뜨는 창에서 스크립트를 호출할시에는 href="#" onclick="스크립트명();" 이런식으로 쓰셔야 합니다.
 
2. 부모창 호출문제
보통 팝업창에서는 opener. 해서 쓰면 parent창이 응답을 하지만,
모달창에서는 parent를 부를 경우, child창에서는 응답하지 않습니다.
이럴땐 dialogArguments를 이용합니다. 그래서 소스를 그대로 쓰실려면
var opener = window.dialogArguments; 이렇게 선언해서 opener를 쓰시면 되겠습니다.

3. Session 전달문제
팝업창(window.open)에서는 팝업창(window.open)으로 전달 가능하고,
모달창(showModalDialog)은 모달창(showModalDialog)으로 전달 가능합니다. ("<%=Session.SessionID%>"로 확인)
showModalDialog에서 window.open하면, 새로운 창으로 인식해서 session을 공유하지 못합니다.

'JavaScript' 카테고리의 다른 글

브라우저의 각종 크기  (0) 2011.12.02
Posted by iWithJoy