js實作滑鼠拖曳圖片並相容於IE/FF火狐/Google等主流瀏覽器_javascript技巧

注意使用preventDefault防止瀏覽器的預設事件操作發生

複製程式碼 程式碼如下:

程式碼如下:



程式碼如下:



程式碼如下:



程式碼如下:



程式碼如下：
var isDrag = false;
function isIE(){
if(navigator.userAgent.indexOf("MSIE")>0){return true;}
else{return false;}
}
function addListener(element,e,fn){
if(isIE()){element.attachEvent("on" e,fn) ;}
else{element.addEventListener(e,fn,false);}
}
function drag(e){
var e = e || window.event;
var element = e.srcElement || e.target;
if(e.preventDefault)e.preventDefault();
else e.returnvalue=false;
isDrag = true;
var relLeft = e. clientX - parseInt(element.style.left);
var relTop = e.clientY - parseInt(element.style.top);
element.onmouseup = function(){ isDrag = false; }
document .onmousemove = function(e_move){
var e_move = e_move || window.event;
if(isDrag){

element.style.left=e_move.clientX - relLeft "px"; return false; } } } window.onload = function() { { var element = document.getElementById("elimg"); var element2 = document.getElementById("eldiv"); addListener(element,"mousedown",drag); addListener (addListener(element,"mousedown",drag); addListener(element2,"mouse ",drag); }