jQ鼠标移入快速显示title

最新推荐文章于 2021-02-04 09:43:29 发布

TrastLian

最新推荐文章于 2021-02-04 09:43:29 发布

阅读量692

点赞数

分类专栏： jQuery html

本文链接：https://blog.youkuaiyun.com/qq_32789381/article/details/51105245

版权

jQuery 同时被 2 个专栏收录

3 篇文章

订阅专栏

html

1 篇文章

订阅专栏

本文介绍了一个使用jQuery实现的鼠标悬停提示框插件。该插件通过修改鼠标悬停时链接元素的标题属性，并在页面上动态创建并显示包含原始标题的提示框来工作。同时，该插件还允许提示框跟随鼠标移动。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

        $(function(){  
            var x = 10;
            var y = 15;
            $('a.tooltip').mouseover(function(e){
                this.myTitle = this.title;
                this.title = "";
                var $tooltip = $("<div id='tooltip' style='position: absolute;border:1px solid'>"+this.myTitle+"</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){
                $('#tooltip').css({
                    "top":e.pageY+y+"px",
                    "left":e.pageX+x+"px"
                });
            });
        });