본문 바로가기

-TIP-/* 컴퓨터

더블클릭 하여서 맨 위/맨 밑으로 이동시키기




<연관검색어>

오유더블클릭, 자바스크립트, 오유 더블클릭 스크립트, 자바스크립트로 인터넷 이동, 맨 아래, 맨 위, 이동 소스,
맨 위 이동 소스, 맨 아래 이동 소스, 맨 위 이동 자바스크립트, 맨 아래 이동 자바스크립트

 




가끔씩 포스트가 긴 스크롤을 볼 때마다 한번에 내리기도 귀찮고 올리고도 귀찮을 때가 종종 있다.

그럴 때 쓰는 자바스크립트가 바로 일명 ' 오유 더블클릭 '

오늘의 유머 : http://www.todayhumor.co.kr/

사툰's와 오늘의 유머를 들어가서 시험을 하면 더블클릭 하면
맨 밑으로 내려가고 또 다시 더블클릭 하면 맨 위로 올라가는 현상을 볼 수 있다.


그 현상은 바로 자바스크립트를 이용한 것인데 지금 부터 하는 방법을 알아보자.



1. 관리자 - HTML/CSS 메뉴로 들어간다.



      





2.
style.html에 <head> ~ </head> 부분에 다음과 같은 스크립트를 삽입한다.


- 첨부파일을 다운로드 해주세요.

<script language=javascript>

<!--
toggle=0;
function dblclick() {
if (toggle==0) {
var sc=99999; toggle=1;
} else {
var sc=0; toggle=0;
}
window.scrollTo(0,sc);
}
if (document.layers) {
document.captureEvents(Event.ONDBLCLICK);
}
document.ondblclick=dblclick;

var IE = document.all?true:false;
if (!IE) document.captureEvents(Event.MOUSEMOVE)
document.onmousemove = getMouseXY;
var tempX = 0;
var tempY = 0;
function getMouseXY(e) {
if (IE) { // grab the x-y pos.s if browser is IE
tempX = event.clientX + document.body.scrollLeft;
tempY = event.clientY + document.body.scrollTop;
} else { // grab the x-y pos.s if browser is NS
tempX = e.pageX;
tempY = e.pageY;
}
if (tempX < 0){tempX = 0;}
if (tempY < 0){tempY = 0;}
return true;
}
// -->
</script>

 


 




3.
자바스크립트가 정상적으로 작동하는지 확인한다.


이 자바스크립트는 IE,크롬에서도 정상 작동하며 아주 편하게 쓰이는 용도기 때문에
인터넷/티스토리를 꾸미는 분들은 넣어두는 것도 효과적인 방법이다.


※ 굳이 티스토리 말고도 html태그를 적용할 수 있는 어디든지라도 스크립트를 넣으면 적용됩니다.


( 원리 : 현재 x값,y값을 구해 스크롤의 위치를 구한 뒤 맨 밑으로 내리고 다시 맨 위로 올려 반복하는 원리 )