jquery制作随鼠标移动的toolTip

  

 

 <p>
                <a href="#" class="tooltip" title="这是我的超链接,一哈哈哈哈">tip----one</a>
     </p>

      

    $(function() {

                    var x = 10;
                    let y = 20;
                    $("a.tooltip").mouseover(function(e) {

                        this.myTitle = this.title;
                        this.title = '';
                        let tooltip = "<div id='tooltip' style='position:absolute;background:pink;padding:8px 12px;border-radius:5px;'>" + this.myTitle + "new" +
                            "</div>";
                        $("body").append(tooltip);
                        $("#tooltip").css({
                            "top": (e.pageY + y) + "px",
                            "left": (e.pageX + x) + "px"
                        }).show("fast");
                    }).mouseout(function() {
                        this.title = this.myTitle;
                        $("#tooltip").remove();
                    }).mousemove(function(e) {
                        console.log("x和y当前距离：", e.pageY, e.pageX);
                        $("#tooltip").css({
                            "top": (e.pageY + y) + "px",
                            "left": (e.pageX) + "px"
                        });
                    })
                })