http://oxtag.com/html/ex/wheelmouse.html
미리보기에서 마우스 오른쪽 클릭하시면 휠마우스가 작동이 됩니다.
그리고 해제는 다시 한번 마우스 오른쪽을 클릭하시면 되구요.
휠마우스 작동이 되면 마우스를 스크롤바 수평선상에서 아래 쪽이나 위 쪽에 위치하면 자동으로 스클롤됩니다.
미리보기에서 스크립트를 다운 받은 후 삽입할 문서의 헤드에 넣으면 되구요. 경로만 수정하면 되겠죠.
아니면 아래 소스를 적용할 문서내에 삽입하세요.
<script language="Javascript" src="http://oxtag.com/html/js/mouse/wheelmouse.js"></script>
wheelmouse.js 소스는 아래와 같습니다. 속도 조절은 중간쯤에 주석 달았으니까 여길 수정하시면 됩니다.
<script>
<!--
var mouseY , winY , scrollY , modes , clicked ;
clicked = "false" ;
function scrollit() {
if ( clicked == "true" ) {
scrollY = document.body.scrollTop ;
if ( modes == 1 ) {
scrollY -= 30 ;
if ( scrollY < 0 ) { scrollY = 0 ; }
} else if ( modes == 2 ) {
scrollY -= 10 ;
if ( scrollY < 0 ) { scrollY = 0 ; }
} else if ( modes == 4 ) {
scrollY += 10 ;
} else if ( modes == 5 ) {
scrollY += 20 ;
}
window.scroll( 0 , scrollY ) ;
//alert( "mode=" + modes + " mouseY=" + mouseY + " winY=" + winY + " scrollY=" + scrollY );
setTimeout( 'scrollit()' , 100 ) ; // 휠 마우스 속도 조절 수치가 낮을 수록 빠름.
}
}
function clicks() {
if (event.button==2 || event.button==3) {
if ( clicked == "false" ) {
clicked = "true" ;
window.status="휠마우스 작동";
alert( "휠마우스 작동" ) ;
scrollit() ;
} else {
clicked = "false" ;
window.status="휘마우스 멈춤";
alert( "휘마우스 멈춤" ) ;
}
}
}
function moves() {
mouseY = window.event.clientY ;
winY = document.body.clientHeight ;
if ( mouseY < winY/5 ) {
modes = 1 ;
} else if ( mouseY < winY*2/5 ) {
modes = 2 ;
} else if ( mouseY > winY*4/5 ) {
modes = 5 ;
} else if ( mouseY > winY*3/5 ) {
modes = 4 ;
} else {
modes = 3 ;
}
}
document.onmousedown = clicks
document.onmousemove = moves
//-->
</script>
반응형
'인터넷정보' 카테고리의 다른 글
이미지가 날아다녀요. (0) | 2007.10.17 |
---|---|
이미지 슬라이드쇼 및 링크 (0) | 2007.10.17 |
이미지 슬라이드쇼 및 링크 (0) | 2007.10.17 |
팝업창 멋지게 열기 (0) | 2007.10.17 |
팝업창 멋지게 열기 (0) | 2007.10.17 |
문서를 휠마우스 처럼 자동으로 스클롤 시키기 (0) | 2007.10.17 |
마우스 오른쪽 버튼 두번 누를 경우 브라우저 다운시키기 (0) | 2007.10.17 |
마우스 오른쪽 버튼 두번 누를 경우 브라우저 다운시키기 (0) | 2007.10.17 |
자바스크립트 오류 메새지 없애기 (0) | 2007.10.17 |
자바스크립트 오류 메새지 없애기 (0) | 2007.10.17 |