Demo:http://ouyo.info/lab/mousepos/
HTML:
测试鼠标坐标的浏览器兼容性
<button id="clear">clear</button>
<button>x</button>
<button>pageX</button>
<button>clientX</button>
<button>layerX</button>
<button>screenX</button>
<button>offsetX</button>
Javascript:
<script> var logbox=document.getElementById("log"); var clearBtn=document.getElementById("clear"); var btns=document.getElementById("btns").getElementsByTagName("button"); var type="clientX"; function log(str){ logbox.innerHTML+=str+""; var sh=logbox.scrollHeight; logbox.scrollTop=sh; //alert(sh) } function clear(){ logbox.innerHTML=""; } clearBtn.onclick=function(e){ if(e&&e.stopPropagation){ e.stopPropagation(); }else{ window.event.cancelBubble=true; } clear(); } logbox.innerHTML="默认:clientX
"; for(var i=0,len=btns.length;i<len;i++){ (function(ele){ ele.onclick=function(e){ if(e&&e.stopPropagation){ e.stopPropagation(); }else{ window.event.cancelBubble=true; } type=this.innerHTML; log("设置:"+type); } })(btns[i]) } document.onclick=function(e){ var e=e||window.event; log("e."+type+":"+e[type]+"") } </script>
Comments(0)