2010-06-30 3 views
0

오페라의 마우스 제스처에서 마우스 흔적을 추가하는 스크립트를 발견했습니다. 아주 좋은 일이지만 한 가지 문제가 있습니다. 마우스 버튼이 눌려 졌을 때이를 감지하고 선 그리기를 시작하지만 마우스 버튼을 놓을 때 감지하지 못합니다. 트레일은 일정 시간 (1 초) 동안 디스플레이됩니다. 버튼 마우스를 누르고있는 동안 화면에 흔적이 표시되도록 스크립트를 업데이트 할 수 있습니까?JavaScript 스크립트 수정 도움말

스크립트는 http://extendopera.org/userjs/content/gesture-tails

var GestureTrail={ 
//options: 
    opacity:1, 
    color:'#f27', 


     canvas:null, 
     _2d:null, 
     start:null, 
     cur:null, 
     isdown:false, 
     init:function(){ 

     /* create a transparent canvas element the size of 
      the full window and insert it into the document */ 
      var canvas=document.createElement('canvas'); 
      canvas.height=window.innerHeight; 
      canvas.width=window.innerWidth; 
      document.body.appendChild(canvas); 
      canvas.style="position:fixed;top:0;display:none;z-index:-999;left:0;opacity:"+this.opacity+";"; 
      this.canvas=canvas; 

     /* grab the 2d methods for the canvas element */ 
      this._2d=this.canvas.getContext('2d'); 

    window.addEventListener("mousemove",function(e){GestureTrail.draw(e);},0); 
    window.addEventListener("mouseup",function(e){GestureTrail.release();},0); 
     }, 
     click:function(e){ 
      if(e.button!=2){return true;} // if not rightclick 
      this.start={x:e.clientX,y:e.clientY}; // set the line start-point to the mouse position 
       this._2d.strokeStyle=this.color; 
      this.isdown=true; 
      setTimeout(function(){GestureTrail.release();},1000); // thanks to Somh for thinking of this 
      }, 
     draw:function(e){ 
      if(!this.isdown){return;} // if the mouse isn't down 
      this.canvas.style.zIndex="999"; // bring the canvas element to the top 
      this.canvas.style.display="block"; /* (must be done on move - if done on mousedown 
               it obscures text selection (HotClick) context menu) */ 
       this.cur={x:e.clientX,y:e.clientY}; // set point to begin drawing from 
    this._2d.beginPath(); 
       this._2d.moveTo(this.start.x,this.start.y); 
       this._2d.lineTo(this.cur.x,this.cur.y); 
       this._2d.stroke(); 
    this.start=this.cur; /* sets the startpoint for the next mousemove to the 
          current point, otherwise the line constantly restarts 
          from the first point and you get a kind of fan-like pattern */ 
     }, 
     release:function(){ 
      this._2d.clearRect(0,0,window.innerWidth,window.innerHeight); // wipe the trails from the entire window 
      this.isdown=false; 
      this.canvas.style.zIndex="-999"; // send the canvas element back down below the page 
      } 
}; 

window.opera.addEventListener("BeforeEvent.mousedown",function(e){GestureTrail.click(e.event);},0); 
window.addEventListener('DOMContentLoaded',function(){GestureTrail.init();},0); 

답변

0

제거에서 발견되었다 :

setTimeout(function(){GestureTrail.release();},1000); // thanks to Somh for thinking of this 

먹으 렴을 클릭 함수의 끝에서. 그 모든

해야하지만 용 프로그램 지불

나는 선택의 모든 종류를 테스트 한
+0

없이 작업을 할 수 있도록 고객이 보지를 들어, 실제 프로그래밍 질문에 대한 사이트입니다. 나는 개발자이고 고객이 아닙니다. 나는 내 필요에 맞게이 스크립트를 어떻게 적용 할 수 있는지 궁금했다. 그 라인을 제거하면 (질문하기 전에 했었습니다.) 라인이 항상 보이도록 만듭니다. 그래서 그것은 해결책이 아닙니다. – Alin

+0

스크립트가 전혀 작동하지 않습니다. 제스처가 끝나면 어떤 사건도 해고되지 않습니다. 귀하의 문제는 mousedown 및 mousemove 이벤트가 호출 될 수 있지만 mouseup 및 그 유일한 방법은 시간 초과가 될 수 있습니다. 잠자리를 열고 사건들이 해고되는 것을보십시오. – M3t0r