jq小demo—模拟鼠标提示动能 e.pageX e.pageY

<p><a href="#" title="tips01" class="tooltip">提示一</a></p>
<p><a href="#" title="tips02" class="tooltip">提示二</a></p>
<p><a href="#" title="自带提示01" >提示一</a></p>
<p><a href="#" title="自带提示02">提示一</a></p>

<script src="./demo_files/jquery-1.12.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
　var x=10;
  var y=20;

  $("a.tooltip").mouseover(function(e){
     this.mytip=this.title;
     this.title="";
     var tooldiv="<div id='tooldiv'>"+this.mytip+"</div>";
     
     $("body").append(tooldiv); //之前忘记了
   
     $("#tooldiv").css({
       //"position":"absolute",
       "left":(e.pageX+x)+"px",
       "top":(e.pageY+y)+"px",
       "color":"red",
       "background":"#fc0"
     }).show(fast);
}).mouseout(function(){
      this.title=this.mytip;
      $("#tooldiv").remove();
}).mousemove(function(e){
      $("#tooldiv").css({
        "left":(e.pageX+x)+"px",
        "top":(e.pageY+y)+"px"
      });
   });
})
//图片提示效果
//var imgTitle=this.myTitle?"<br/>"+this.myTitle:"";
//var tooltip="<div id='tooltip'><img src='"+this.href+"alt='产品预览图' />"+imgTitle"</div>"; 元素，图片提示

</script>