공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday

티스토리 뷰

■ 프론트엔드 ■/JavaScript

마우스휠 - addEventListener, onmousewheel

serpiko 2013. 10. 13. 23:54

1.브라우저에따른 이벤트 검사 (addEventListener, on_mousewheel)

 

1
2
3
4
5
6
 
//scroll event;
if (window.addEventListener)
/** DOMMouseScroll is for mozilla. */
window.addEventListener('DOMMouseScroll', this.wheel, false);
/** IE/Opera. */
window.on_mousewheel = document.on_mousewheel = this.wheel;

 

2. 휠 메서드

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
 
/******************************************************
* wheel
******************************************************/
View.prototype.wheel = function(){
 var delta = 0;
 if (!event) /* For IE. */
   event = window.event;
 if (event.wheelDelta) { /* IE/Opera. */
   delta = event.wheelDelta/120;
 } else if (event.detail) { /** Mozilla case. */
   delta = -event.detail/3;
 }
 _this.scroll(delta); //
}

 

 

3.스크롤 처리

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
 
View.prototype.scroll = function($delta){
 if($delta > 0){
  this.posX+=30;
  if(this.posX > 0) this.posX = 0;
 }

 if($delta< 0){
  this.posX-=30;
  if(this.posX < -(this.imageWidth - this.stageWidth)){
   this.posX = -(this.imageWidth - this.stageWidth);
  }
 }
 this.moveLeft = _controller.setMoveLeft(false);
 this.moveRight = _controller.setMoveRight(false);

 $("#bgContainer").css({"left":this.posX});
}
저작자표시 비영리 변경금지

'■ 프론트엔드 ■ > JavaScript' 카테고리의 다른 글

clientX,Y - 현재화면의 마우스좌표 반환받기  (0) 2013.10.13
시간함수 - new Date  (0) 2013.10.13
키보드 입력 - 3가지 솔루션  (0) 2013.10.13
디바이스 감지 - window.navigator.userAgent  (0) 2013.10.13
new - Class생성  (0) 2013.10.13
댓글