로이데스트

window객체 scrollBy() scrollTo() 스크롤 위치[상대적, 절대적]

| javascript/window()객체

2014. 2. 8. 10:00

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ko">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
</head>
<body>
<div id="ex_js_syntax">
<script type="text/javascript" language="javascript">
<!--
function window_open_scroll(){
/* 윈도우 창 열기 => window.open(); */
open_scrollby_specs = "width=350, height=200, top=300, left=300";
open_scrollby_window = window.open("", "open_scrollby_window", open_scrollby_specs, false);
open_scrollby_window.document.write("<p style='height:1500;'>open_scrollby_window 스크롤 열음</p>");
document.getElementById("window_open_scroll").innerHTML = "스크롤열기";
}
function window_scrollby(){
/* 윈도우 스크롤 상대적 위치 => window.scrollBy(넓이 위치, 높이 위치); */
open_scrollby_window.scrollBy(0,100);
open_scrollby_window.focus();
document.getElementById("window_scrollby").innerHTML = "scrollby() 상대적 스크롤 위치[클릭]";
}
function window_scrollto(){
/* 윈도우 스크롤 절대적 위치 => window.scrollTo(넓이 위치, 높이 위치); */
open_scrollby_window.scrollTo(0,150);
open_scrollby_window.focus();
document.getElementById("window_scrollto").innerHTML = "scrollto() 절대적 스크롤 위치[클릭]";
}
//-->
</script>
<form name="input_type" id="input_type" method="post" >
윈도우 => 스크롤 위치 <br />
<p id="window_open_scroll" onclick="window_open_scroll();">window객체-메서드 scroll()사용할 open()[클릭]</p>
<p id="window_scrollby" onclick="window_scrollby();">window객체-메서드 scrollby() 상대적 스크롤 위치[클릭]</p>
<p id="window_scrollto" onclick="window_scrollto();">window객체-메서드 scrollto() 절대적 스크롤 위치[클릭]</p>
</form>
</div>
</body>
</html>

--------------------------------------------------------------------------------------------

위 소스 예제 보기

window.scrollBy()

window.scrollTo()

윈도우 스크롤 상대적 위치 => window.scrollBy(넓이 위치, 높이 위치)

윈도우 스크롤 절대적 위치 => window.scrollTo(넓이 위치, 높이 위치)

window 속성 보기(접어두었습니다.)

출처 & 인용 - http://www.w3schools.com/

저작자표시 비영리 변경금지

'javascript > window()객체' 카테고리의 다른 글

window객체 setTimeout() clearTimeout() 대기 후 한번만 실행 [실행, 해제] (0)	2014.02.08
window객체 setInterval() clearInterval() 반복 실행 [실행, 해제] (0)	2014.02.08
window객체 resizeBy() resizeTo() 창크기[상대적, 절대적] (0)	2014.02.08
window객체 moveBy() moveTo() 창 이동[상대적, 절대적] (0)	2014.02.08
window객체 open() close() 창 열고 닫기 (0)	2014.02.08