Question

<html>
<head>
        <script type='text/javascript' src='http://code.jquery.com/jquery-1.4.2.js'></script>

    <style type="text/css">
#fake /* fake cursor */
{
  float:left;
  position:absolute;
  z-index:99;
}



</style>
<script type='text/javascript'>
$('#div1').ready(function() {

  $('#div1').bind('mousemove', function(e){
  $('#fake').css({
     left:  e.pageX + 200,
     top:   e.pageY
  });
  });


});


</script>

</head>
<body style="cursor:text;">


<div id="div1" style="height:300px;width:300px;border:1px solid red;"></div>


  <div id="fake" ><img id="cursor" src="xp.png" /></div><br />

<body>

</html>

我希望在鼠标光标离开div1时隐藏假光标。我可以这样做。我尝试使用下面的代码，但它工作。请帮助。对于任何关于肩膀冲浪的建议都是最受欢迎的。

$("#div1").mouseout(function () {
$("#fake").hide();
});

Answer 1

尝试使用Jquery的.on语句而不是单独的mousemove和mouseout事件：

 $("#div1").on({
        mousemove: function () {
            $('#fake').css({
                left: e.pageX + 200,
                top: e.pageY
            });
        },
        mouseout: function () {
            $("#fake").hide();
            alert("Mouse Out!")
        }
    });

JSfiddle

如何在javascript中制作假游标

1 个答案: