반응형
얼마전에 CDMANI 님 블로그에 간적이 있습니다. 더블클릭으로 블로그를 더 편하게라는 포스팅을 보고 저도 해봤는데 이게 은근히 편하더군요~ 그래서 여러분에게 소개 할까 합니다.
사실 별로 어렵지 않은 팁이라서, 여러분도 쉽게 적용해서 유용하게 사용할수 있습니다.
자 먼저 어떻게 작동하는지에 대해서 보여드리겠습니다.
지금 바로 제 블로그에 빈공간에 마우스로 더블 클릭을 해보시고, 다시 더블 클릭을 해보세요!
해보셨나요!
해보신분은 아시겠지만, 아무곳이나 한번 더블 클릭하면 맨 하단으로 내려가고, 또 한번 더블 클릭하면 맨 상단으로 올라옵니다. 즉 한번에 맨 상단으로 또 다시 한번 하면 맨 하단으로 자동으로 이동 된다는겁니다.
소스는 다음과 같습니다.
위의 소스를 블로그의 HTML/CSS 에서 <HEAD>와 </HEAD> 사이에 넣어주면 됩니다.
위의 소스는 IE6, IE7, FIREFOX 3.0 에서 정상 작동중이라고 CDMANI님께서 말씀 해주셨습니다. ㅎㅎ
대부분의 블로그에서는 TOP으로 이동하는 아이콘이 스크롤바를 따라 다닙니다. 그건 마우스로 해당 부분을 클릭 해야지만, 이 소스는 어떤곳이든 아무곳에서나 더블 클릭하면 바로 상단으로 이동하고 확인후에 다시 더블 클릭하면 맨 하단으로 이동 하기 때문에, 유용함이 더 합니다.
그리고 방문자도 알아볼수 있게 저처럼 댓글 창 밑에다가 더블 클릭시 맨 상단으로 이동합니다라고 문구를 써주시는것도 좋습니다.^^/
사실 별로 어렵지 않은 팁이라서, 여러분도 쉽게 적용해서 유용하게 사용할수 있습니다.
자 먼저 어떻게 작동하는지에 대해서 보여드리겠습니다.
지금 바로 제 블로그에 빈공간에 마우스로 더블 클릭을 해보시고, 다시 더블 클릭을 해보세요!
해보셨나요!
해보신분은 아시겠지만, 아무곳이나 한번 더블 클릭하면 맨 하단으로 내려가고, 또 한번 더블 클릭하면 맨 상단으로 올라옵니다. 즉 한번에 맨 상단으로 또 다시 한번 하면 맨 하단으로 자동으로 이동 된다는겁니다.
소스는 다음과 같습니다.
<script language='javascript'>
toggle=0;
document.ondblclick = function(event)
{
if(window.event)
{
EventStatus = window.event.srcElement.tagName;
}
else
{
EventStatus = event.target.tagName;
}
if(EventStatus!='INPUT'&&EventStatus!='TEXTAREA')
{
if(toggle==0)
{
var sc=99999; toggle=1;
}
else
{
var sc=0; toggle=0;
}
window.scrollTo(0,sc)
}
}
</script>
toggle=0;
document.ondblclick = function(event)
{
if(window.event)
{
EventStatus = window.event.srcElement.tagName;
}
else
{
EventStatus = event.target.tagName;
}
if(EventStatus!='INPUT'&&EventStatus!='TEXTAREA')
{
if(toggle==0)
{
var sc=99999; toggle=1;
}
else
{
var sc=0; toggle=0;
}
window.scrollTo(0,sc)
}
}
</script>
위의 소스를 블로그의 HTML/CSS 에서 <HEAD>와 </HEAD> 사이에 넣어주면 됩니다.
위의 소스는 IE6, IE7, FIREFOX 3.0 에서 정상 작동중이라고 CDMANI님께서 말씀 해주셨습니다. ㅎㅎ
대부분의 블로그에서는 TOP으로 이동하는 아이콘이 스크롤바를 따라 다닙니다. 그건 마우스로 해당 부분을 클릭 해야지만, 이 소스는 어떤곳이든 아무곳에서나 더블 클릭하면 바로 상단으로 이동하고 확인후에 다시 더블 클릭하면 맨 하단으로 이동 하기 때문에, 유용함이 더 합니다.
그리고 방문자도 알아볼수 있게 저처럼 댓글 창 밑에다가 더블 클릭시 맨 상단으로 이동합니다라고 문구를 써주시는것도 좋습니다.^^/
2009년 12월 18일 추가
위의 소스 내용중에 두번째 줄인 toggle=0; 의 0을 1로 변경하면 처음 더블클릭시 작동되는 부분이 상단부터 이동하게 됩니다...
위의 소스대로만 적용하시면 처음 더블클릭시 하단부터 이동하게 됩니다....
위의 소스 내용중에 두번째 줄인 toggle=0; 의 0을 1로 변경하면 처음 더블클릭시 작동되는 부분이 상단부터 이동하게 됩니다...
위의 소스대로만 적용하시면 처음 더블클릭시 하단부터 이동하게 됩니다....
반응형
'나이스팁 > 블로그' 카테고리의 다른 글
| 블로그얌에서 파워블로거를 모집합니다. (10) | 2008.09.06 |
|---|---|
| 고마운 '걸' 블로그 1년 채워준 그녀 (15) | 2008.09.04 |
| 이메일 잘못 온 추출오류님의 블로그얌 이메일! (2) | 2008.08.28 |
| 오픈블로그 랭킹 TOP10 진입 좋아할일은 아니다! (16) | 2008.08.27 |
| 티스토리 댓글 반자동 로그인 방법 (27) | 2008.08.26 |
 |
 |
|
|||||
 |
 |
 |
|||||
 |
|||||||
 |
|||||||
 |
|||||||
| 공감 | |||||||
 |
|||||||
 |
 |
 |
 |
||||
 |
 |
||||||
 |
|||||||
 |
 |
 |
|||||
 |
|||||||
|
|
|
|
|
|
|
|
|
 |
 |
 |
 |
 |
 |
 |
