웹마스터 팁
마우스 이벤트 발생시 문서 상,하단으로 이동
2003.10.30 15:44
긴문서를 읽다가 다시 메뉴가 상단에 위치한 홈페이지에서
다른 컨텐츠로 이동하려할때 마우스로 스크롤바를 끌어 이동하기가 고로우신(귀차니스트 맴버님들) 분들을 위해
아래의 스크립트를 게시판 문서내에 코딩 하시면 좀더 편하게 게시물읽기와 원활한 홈운영이 조금이나마 되려 봅니다.
이 소스는 중복일 가능성이 좀 높습니다.
뭍고답하기, 기타, 제로보드사용팁 등의 게시판에서 올라왔을줄 압니다(검색 안해봤음 ㅡㅛㅡ;;)
그럼에도 올리는것은 갖잖은 응용법을 올린답시고 이렇게 올리니
삭제하셔도 무방하며 아시는분들은 그냥 봐 주세요 ^^;;
출처지 : 미니위니
[소스 사용예의 간략설명]
상단으로 문서이동 하고 싶을때는 <span id=IAMTHETOP></span> 를 <BODY>의 첫줄에 삽입하고,
하단으로 문서이동 하고 싶을때는 <span id=IAMTHEBOTTOM></span> 를 </BODY>의 바로 윗줄에 삽입하고 사용 하세요.
[기본편 문서예제]
########## 상단으로 문서이동 ###########
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<title>상단으로 문서 이동</title>
<script language="javascript" type="text/javascript">
function viewTop()
{
IAMTHETOP.scrollIntoView(true);
}
document.ondblclick=viewTop;
</script>
</head>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red">
<span id=IAMTHETOP></span>
<table border="0" height="300%">
<tr>
<td width="100%">
<p> </p>
</td>
</tr>
</table>
</body>
</html>
########## 하단으로 문서이동 ###########
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<title>더블클릭시 문서 하단으로 이동</title>
<script language="javascript" type="text/javascript">
function viewBottom()
{
IAMTHEBOTTOM.scrollIntoView(true);
}
document.ondblclick=viewBottom;
</script>
</head>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red">
<table border="0" height="300%">
<tr>
<td width="100%">
<p> </p>
</td>
</tr>
</table>
<span id=IAMTHEBOTTOM></span>
</body>
</html>
[응용편 문서예제]
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<title>문서 상단으로 이동(더블, 우측클릭)</title>
<script language="javascript" type="text/javascript">
//===== 오른쪽 마우스 클릭시
function viewTop()
{
IAMTHETOP.scrollIntoView(true);
}
document.oncontextmenu=viewTop;
//===== 더블클릭시
function viewTop2()
{
IAMTHETOP2.scrollIntoView(true);
}
document.ondblclick=viewTop2;
</script>
</head>
<body ondragstart='return false' onselectstart='return false' oncontextmenu='return false'>
<span id=IAMTHETOP></span>
<span id=IAMTHETOP2></span>
<table border="0" height="300%">
<tr>
<td width="100%">
<p> </p>
</td>
</tr>
</table>
</body>
</html>
다른 컨텐츠로 이동하려할때 마우스로 스크롤바를 끌어 이동하기가 고로우신(귀차니스트 맴버님들) 분들을 위해
아래의 스크립트를 게시판 문서내에 코딩 하시면 좀더 편하게 게시물읽기와 원활한 홈운영이 조금이나마 되려 봅니다.
이 소스는 중복일 가능성이 좀 높습니다.
뭍고답하기, 기타, 제로보드사용팁 등의 게시판에서 올라왔을줄 압니다(검색 안해봤음 ㅡㅛㅡ;;)
그럼에도 올리는것은 갖잖은 응용법을 올린답시고 이렇게 올리니
삭제하셔도 무방하며 아시는분들은 그냥 봐 주세요 ^^;;
출처지 : 미니위니
[소스 사용예의 간략설명]
상단으로 문서이동 하고 싶을때는 <span id=IAMTHETOP></span> 를 <BODY>의 첫줄에 삽입하고,
하단으로 문서이동 하고 싶을때는 <span id=IAMTHEBOTTOM></span> 를 </BODY>의 바로 윗줄에 삽입하고 사용 하세요.
[기본편 문서예제]
########## 상단으로 문서이동 ###########
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<title>상단으로 문서 이동</title>
<script language="javascript" type="text/javascript">
function viewTop()
{
IAMTHETOP.scrollIntoView(true);
}
document.ondblclick=viewTop;
</script>
</head>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red">
<span id=IAMTHETOP></span>
<table border="0" height="300%">
<tr>
<td width="100%">
<p> </p>
</td>
</tr>
</table>
</body>
</html>
########## 하단으로 문서이동 ###########
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<title>더블클릭시 문서 하단으로 이동</title>
<script language="javascript" type="text/javascript">
function viewBottom()
{
IAMTHEBOTTOM.scrollIntoView(true);
}
document.ondblclick=viewBottom;
</script>
</head>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red">
<table border="0" height="300%">
<tr>
<td width="100%">
<p> </p>
</td>
</tr>
</table>
<span id=IAMTHEBOTTOM></span>
</body>
</html>
[응용편 문서예제]
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<title>문서 상단으로 이동(더블, 우측클릭)</title>
<script language="javascript" type="text/javascript">
//===== 오른쪽 마우스 클릭시
function viewTop()
{
IAMTHETOP.scrollIntoView(true);
}
document.oncontextmenu=viewTop;
//===== 더블클릭시
function viewTop2()
{
IAMTHETOP2.scrollIntoView(true);
}
document.ondblclick=viewTop2;
</script>
</head>
<body ondragstart='return false' onselectstart='return false' oncontextmenu='return false'>
<span id=IAMTHETOP></span>
<span id=IAMTHETOP2></span>
<table border="0" height="300%">
<tr>
<td width="100%">
<p> </p>
</td>
</tr>
</table>
</body>
</html>
댓글 3
-
RedEye(kaist)
2003.10.30 15:47
오리지날 소스는 더블클릭시에 문서 상단으로 이동하는 소스를 응용하여 문서하단으로 이동과 오른쪽마우스 클릭시 이동하는것들은 제 나름대로 바꾸어 본것 입니다. 아마도 익스프롤러(IE전용)인것 같은.... 테스트도 익스6 sp2 버전에서 했습니다. -
TheMics
2003.10.30 17:14
미니위니에서 쓰는 소스네요.. -
RedEye(kaist)
2003.10.31 00:56
TheMics //출처지 정정 했습니다 ^^;;
| 제목 | 글쓴이 | 날짜 |
|---|---|---|
| VMware로 윈도우에서 리눅스 설치하기 [8] | 강민 | 2002.08.05 |
FTP 에 사용자추가후 로그인부분 추가하기 - 사용자추가부분
[5]
 | DearMai | 2002.08.12 |
|
FTP 에 사용자추가후 로그인부분 추가하기 - 로그인 부분
[2]
| DearMai | 2002.08.12 |
|
MSSQL 2000 Enterprise Edition 설치하기
[7]
| DearMai | 2002.08.12 |
| 웹호스팅 세팅기 [8] | 임현 | 2002.08.13 |
| 루트만 이용할수있게 바꿔야하는 명령어들 몇가지 [3] | 임현 | 2002.08.14 |
| [APM설치]윈도우에서 웹서버 세팅하기 [49] | 김영남 | 2002.08.14 |
| win2k, apache2.0.40 + php-4.2.2로 업글하기 | ZIO | 2002.08.20 |
| 웹호스팅 세팅기 1편 - 설치하기(1부) [16] | 임현 | 2002.08.22 |
| 웹호스팅 세팅기 1편 - 설치하기(2부) [3] | 임현 | 2002.08.22 |
| APM 자동설치 프로그램 [4] | Captain DirtBuster | 2002.08.24 |
| 무단링크를 방지하여 트래픽을 줄이기(아파치) [5] | 착한마음™ | 2002.08.24 |
| 웹호스팅의 꽃 A.P.M.~ 을 알아보자! (1부) [9] | 임현 | 2002.08.25 |
| 남구스의 DNS/POP3/계정추가 쉘스크립 [2] | 김남규 | 2002.08.27 |
| 남구스의 DB 백업 쉘 스크립 [1] | 김남규 | 2002.08.27 |
| 포트 번호 없이 도메인 연결하기. [15] | Winnie | 2002.08.27 |
| 웹호스팅의 꽃 APM 완벽설치 가이드 (linux) | BJ | 2002.09.05 |
| 강좌는 아니지만, 제가 쓸 강좌가 어떤방향으로 나아가야하는지를 잘 모르겠습니다. 그래서 글올립니다. [4] | Dopesoul | 2002.09.06 |
| What is the MRTG? [4] | Dopesoul | 2002.09.06 |
|
[Apache] 윈도우 NT 계열에 서비스 등록하기
[1]
| 스카이 | 2002.09.08 |