js跨浏览器事件处理程序

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8"/>
</head>
<body>
  <div id="myDiv">
  	aaaaaaaaaaaaaaaaaaa
  </div>
  <ul id="myMenu" style="position:absolute;visibility:hidden;background-color:silver;">
  	<li>
  		<a href="">sasdsasdasdadasd</a>
  	</li>
  		<li>
  		<a href="">saswerwerwedgddadasd</a>
  	</li>
  		<li>
  		<a href="">sasdwewrwreadasd</a>
  	</li>
  </ul>
	<script type="text/javascript">
      var EventUtil = {
    addHandler: function(element, type, handler) {
        if (element.addEventListener) {
            element.addEventListener(type, handler, false);
        } else if (element.attachEvent) {
            element.attachEvent("on" + type, handler);
        } else {
            element["on" + type] = handler;
        }
    },
    getEvent: function(event) {
        return event ? event : window.event;
    },
    getTarget: function(event) {
        return event.target || event.srcElement;
    },
    getRelatedTarget: function(event) {
        if (event.relatedTarget) {
            return event.relatedTarget;
        } else if (event.toElement) {
            return event.toElement;
        } else if (event.fromElement) {
            return event.fromElement;
        } else {
            return null;
        }
    },
    getButton: function(event) {
        if (document.implementation.hasFeature("MouseEvents", "2.0")) {
            return event.button;
        } else {
            switch (event.button) {
            case 0:
            case 1:
            case 3:
            case 5:
            case 7:
                return 0;
            case 2:
            case 6:
                return 2;
            case 4:
                return 1;
            }
        }
    },
    getCharCode: function(event) {
        if (typeof event.charCode == "number") {
            return event.charCode;
        } else {
            return event.keyCode;
        }
    },
    getWheelDelta: function(event) {
        if (event.wheelDelta) {
            return (client.engine.opera && client.engine.opera < 9.5 ? -event.wheelDelta : event.wheelDelta);
        } else {
            return -event.detail * 40;
        }
    },
    getClipboardText: function(event) {
        var clipboardData = (event.clipboardData || window.clipboardData);
        return clipboardData.getData("text");
    },
    setClipboardText: function(event, value) {
        if (event.clipboardData) {
            return event.clipboardData.setData("text/plain", value);
        } else if (window.clipboardData) {
            return window.clipboardData.setData("text", value);
        }
    },
    preventDefault: function(event) {
        if (event.preventDefault) {
            event.preventDefault();
        } else {
            event.returnValue = false;
        }
    },
    removeHandler: function(element, type, handler) {
        if (element.removeEventListener) {
            element.removeEventListener(type, handler, false);
        } else if (element.detachEvent) {
            element.detachEvent("on" + type, handler);
        } else {
            element["on" + type] = null;
        }
    },
    stopPropagation: function(event) {
        if (event.stopPropagation) {
            event.stopPropagation();
        } else {
            event.cancelBubble = true;
        }
    }
};
      EventUtil.addHandler(window,'load',function(event){
      	var div=document.getElementById('myDiv');
      	EventUtil.addHandler(div,'contextmenu',function(event){
      		event=EventUtil.getEvent(event);
      		EventUtil.preventDefault(event);

      		var menu=document.getElementById("myMenu");
      		menu.style.left=event.clientX+'px';
      		menu.style.top=event.clinetY+'px';
      		menu.style.visibility='visible';
      	});
      	EventUtil.addHandler(document,'click',function(event){
      		document.getElementById("myMenu").style.visibility="hidden";
      	});
      });
	</script>
</body>
</html>
当你点击aaa部分,ul显示的位置跟随你鼠标位置去显示,自己加下css样式和弄个定时器,可以做出非常绚丽的效果

js跨浏览器事件处理程序,古老的榕树,5-wow.com

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。