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);
없이 작업을 할 수 있도록 고객이 보지를 들어, 실제 프로그래밍 질문에 대한 사이트입니다. 나는 개발자이고 고객이 아닙니다. 나는 내 필요에 맞게이 스크립트를 어떻게 적용 할 수 있는지 궁금했다. 그 라인을 제거하면 (질문하기 전에 했었습니다.) 라인이 항상 보이도록 만듭니다. 그래서 그것은 해결책이 아닙니다. – Alin
스크립트가 전혀 작동하지 않습니다. 제스처가 끝나면 어떤 사건도 해고되지 않습니다. 귀하의 문제는 mousedown 및 mousemove 이벤트가 호출 될 수 있지만 mouseup 및 그 유일한 방법은 시간 초과가 될 수 있습니다. 잠자리를 열고 사건들이 해고되는 것을보십시오. – M3t0r