获取鼠标位置

标签：

IE 下获取 clientX/Y


<script>
  function layer (){
   var z =event.clientX;//鼠标横坐标
   var f=event.clientY;//鼠标纵坐标

alert(z);//打印坐标数
}
</script>
<a onmouseover="layer()">测试测试</a>
FireFox 下获取 clentX/Y
<script>
  function layer (e){
   var z =e.clientX;//鼠标横坐标
   var f=e.clientY;//鼠标纵坐标
alert(z);//打印坐标数
}
</script>
<a onmouseover="layer(event)">测试测试</a>
进而核心可以升阶：
 var z =e.clientX|| event.clientX;//鼠标横坐标
 var f=e.clientY|| event.clientY;//鼠标纵坐标
 这样一来就可以在ie和firefox中都可以使用了

-----------------------------------------------------------------

点击a标签显示div，然后点击显示的div内部的内容时，此div不会消失，若点击此div外部的内容时，此div消失。
另：显示的div是显示在鼠标点击的位置处，以后可供参考。
<style type="text/css">
    #show {
        border: 1px solid black;
        background-color: #E5F0FB;
        position: absolute;
        width: 150px;
        height: 100px;
        display: none;
    }
</style>
<script src="../JS/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function () {
        $(document).click(function (e) {
            if (e.target.id != "show") {
                $("#show").hide();
            }
        });
        $("a").click(function (e) {
            $("#show").css({ left: e.clientX, top: e.clientY }).show();
            return false; //防止冒泡
        });
    });
</script>
    
<div>
    <a href="#">click me</a>
    <div id="show"></div>
</div>

获取鼠标位置

标签：

原文地址：http://www.cnblogs.com/thinklife/p/4427720.html