<BODY>
<A name=top></A>
..
..
<img src=../gif/rfbtexm1.gif><br><br>
<div class=brown>
아래로 내려가서 단추들을 눌러 보세요.<br>
<script Language="Javascript">
now=new Date(); // 현재의 일자, 시간 얻음
mm=now.getMinutes(); // 현재의 초 설정
document.write ('<li>now=new Date()'); // 설명 표시
document.write ('<li>mm=now.getMinutes()<br><ol>');// 설명 표시
for (var i=1; i<=15;i++) {
document.write ('<li><a name=loc'+i+ // 각 번호마다 앤커 이름 부여
'></a><span class=blue><a name=loc'+i+ // 각 번호마다 앤커 표시
'></a></span>now.setMinutes(mm-',i, // 각 번호마다 시각 설명
')=',now.setMinutes(mm-i),'=',
now.toLocaleString(), // 각 번호마다 시각 표시
'<br><br>');
}
function gojump(hash){
if ((hash<1)||(hash>15)){ // 입력 데이터 범위 점검
alert('범위를 1-15로 하시오'); return; // 범위 틀리면 경고하고 return
}
self.location.hash='loc'+hash; // 맞으면 그 번호로 이동
}
// 감춤 끝 -->
</script>
</ol>
<div class=indent>
<form name="fname">
<ul class=balla>
<li>자체 페이지 지정 부위에(일부러 간격을 넓혔슴)
<ul>
<li><input type="button" value="1 번" onClick="self.location.hash='loc1'">
self.location.hash='loc1'
<li><input type="button" value="5 번" onClick="self.location.hash='loc5'">
self.location.hash='loc5'
<li><input type="button" value="10 번" onClick="self.location.hash='loc10'">
self.location.hash='loc10'
<li><input type="button" value="15 번" onClick="self.location.hash='loc15'">
self.location.hash='loc15'<br><br>
</ul>
<li>입력 번호로
<ul>
<li><input type=text size=3 name="point" value="1" onchange="javascript:gojump(this.value)">
번으로
<input type="button" value="확인" onclick="javascript:gojump(fname.point.value)">
self.location.hash='loc' + [입력번호]<br><br>
</ul>
<li>맨위, 맨아래로
<ul>
<li><input type="button" value="페이지 맨위" onClick="self.location.hash='top'">
self.location.hash='top'
<li><input type="button" value="페이지 바닥" onClick="self.location.hash='bottom'">
self.location.hash='bottom'<br><br>
</ul>
<li>이전, 이후
<ul>
<li><input type='button' value='이전' onClick='history.back()'> history.back()
<li><input type='button' value='이후' onClick='history.forward()'> history.forward()
</ul><br><br>
<li>다른 프레임(모체 프레임에서) 페이지 지정 부위에<br>
<span class=smallblue>(이하 예제들은 실제적으로는 자체 페이지에 연결 시켰으나<br>
프레임 네임 만 바꾸면 다른페이지에 연결 됨.)<br>
아래 수평 메뉴 페이지 프레임의 경우와 같음</span>
<pre class=smallblue>frame 구조
vmenu : 좌측 수직 메뉴 프레임
right : 나머지 우측 부분 프레임
main : 우측 프레임 중 상단 주 데이터 프레임(현재의 프레임)
hmenu : 우측 프레임 중 상단 수평 프레임
</pre>
<ul>
<li><a href="javascript:parent.main.location.hash='top'"><img src="../../gif/arup.gif"
border=0 alt="페이지 맨위"></a> parent.<b>main</b>.location.hash='top'
<li><a href="javascript:parent.main.location.hash='bottom'"><img src="../../gif/ardown.gif"
border=0 alt="페이지 바닥"></a> parent.<b>main</b>.location.hash='bottom'<br><br>
</ul>
<li>혹은 최상위 페이지로 부터 지정<br>
<ul>
<li><a href="javascript:top.right.main.location.hash='top'"><img
src="../../gif/arup.gif" border=0 alt="페이지 맨위"></a>
top.<b>right.main</b>.location.hash='top'
<li><a href="javascript:top.right.main.location.hash='bottom'"><img
src="../../gif/ardown.gif" border=0 alt="페이지 바닥"></a>
top.<b>right.main</b>.location.hash='bottom'<br>
</ul>
</ul>
</div>
</form>
..
..
<a name="bottom"></a>
</body>
</html>
 중요 사항
- self.location.hash로 자체 페이지의 부위(fragment)로 감. <A href=#...>...</A>와 같은 의미
- .toLocaleString()는 일자, 시간을 현지 일자, 시간으로 표현하라는 것임.
- history.forward()에서는 최종 방문 이후의 것은 무시 된다. 다시 말하면 방문 했던 적이 있는 경우에 만 해당된다. 이는 아래 단추 위에 마우스를 대면 '다음 페이지(이전 페이지로 이동 했을 때 만)'이 나타나는 것과 같은 의미이다.
- for (var i=1; i<=15;i++) {...}로 1분씩 15번 반복하였으며, 5와 10에서 anchor identifier(<A name='...'></A>)를 만들었다.
종료 tag(</A>)가 없으면 문제를 일으키는 경우가 있으므로 항상 기재하도록 습관화하는 것이 종다.
|
제공