鼠标浮动自带超链接提示

思路
1.鼠标移入超链接、
2.创建一个div元素，元素的内容为title的属性的值
3.为创建的元素追加到文档中
4.为它设置x和y轴的坐标，移除div元素

<p><a href="#" class="tooltip" title="这是我的超链接提示1">提示1</a></p>
<p><a href="#" class="tooltip" title="这是我的超链接提示2">提示2</a></p>
<p><a href="#" class="tooltip" title="这是自带提示1">自带提示1</a></p>
<p><a href="#" class="tooltip" title="这是自带提示2">自带提示2</a></p>

$(function () {
       var x = 20;
       var y = 20;
       $("a.tooltip").mouseover(function (e){
           //创建一个div元素
           this.myTitle = this.title;
           this.myTitle="";
        var tooltip = " <div id='tooltip'>"+this.myTitle+"</div>";/*创建div元素*/
        $("body").append(tooltip);/*div元素追加到文档中*/
        $("#tooltip")
            .css({
                "top":e.pageY + "px",
                "left":e.pageX + "px",
            }).show("fast");/*设置x和y坐标。并且显示*/
       }).mouseout(function () {
           //隐藏title
           this.myTitle = this.myTitle;
           $("#tooltip").remove();
       }).mousemove(function (e) {
           $("#tooltip")
               .css({
                   "top":(e.pageY+y)+"px",
                   "left":(e.pageX+x)+"px"
               })
       })
   })