2012-10-26 2 views
1

내 페이지에 이미지가 있고 마우스가 내려 갔을 때 onmousemove 이벤트를 듣고 싶습니다. 하지만 브라우저 (Firefox)에서 이미지를 드래그하면 실제로 이미지를 드래그 할 수 없으므로 원하지 않습니다.img가 html로 이동하지 않도록 설정하십시오.

자바 스크립트 부분 :

document.onmousemove=getMouseCoordinates; 

var x; 
var y; 
var clicked = false; 

function getMouseCoordinates(event){ 
    ev = event || window.event; 
    x = ev.pageX; 
    y = ev.pageY; 
} 

    function onClickMap(){ 
     var obj = document.getElementById("selectArea"); 
     var tempX = x; 
     var tempY = y; 

    obj.style.left = tempX + "px"; 
    obj.style.top = tempY + "px"; 

    clicked = true; 
} 

function onMoveMap(){ 
    if(clicked){ 
     var obj = document.getElementById("selectArea"); 
     var xToSize = Math.abs(parseInt(obj.style.left) - x); 
     var yToSize = Math.abs(parseInt(obj.style.top) - y); 
     obj.style.width = xToSize + "px"; 
     obj.style.height = yToSize + "px"; 
    } 
} 

HTML 부분 :

여기
<img src="pixels.png" id ="pixelDiv" usemap="#pixelMap" onClick="onClickMap()" onmousemove="onMoveMap()"> 
+0

이미지를 드래그하지 않겠습니까? –

+0

CSS'-webkit-user-drag : none; '을 사용할 수 있지만 webkit atm에서만 지원됩니다. – Shmiddty

답변

2

는 jQuery를 솔루션입니다

여기 내 코드입니다.

모든 드래그 해제됩니다

$(document).bind("dragstart", function(e) { 
    if (e.target.nodeName.toUpperCase() == "IMG") { 
     return false; 
    } 
}); 
0

당신은 단지 false를 반환하는 이는 MouseDown 처리기를 추가 할 수 있습니다

$(document).bind("dragstart", function() { 
    return false; 
}); 

사용하지 않을 경우

만에 img 요소를 드래그. 이것은 FF에서 끌기를 멈추는 것처럼 보인다.

0

확인이 좋다,하지만 난 그게 파이어 폭스는 특정 지금은 onlcick 내 이미지의 onmove 방법을 사용할 뭔가 생각,하지만 난 STIL 나는 해결책을 발견했습니다

지금 이미지를 드래그 할 수 있습니다, I이었다 이 항목을 찾으십니까?

http://www.develobert.info/2008/10/disable-firefox-image-drag.html

관련 문제