自定义鼠标悬浮式事件

最新推荐文章于 2021-11-08 14:05:17 发布

阿波次嘚

最新推荐文章于 2021-11-08 14:05:17 发布

阅读量227

点赞数

本文链接：https://blog.csdn.net/weixin_45062076/article/details/118241232

版权

//css

 .titleShow {
            display: none;
            height: 15px;
            width: auto;
            position: absolute;
            z-index: 5999;
            padding: 2px 10px;
            border-radius: 3px;
            color: #fff;
            background: #5B697B;
            -webkit-box-shadow: 1px 1px 3px #ccc;
            -moz-box-shadow: 1px 1px 3px #ccc;
            box-shadow: 1px 1px 3px #ccc;
            word-break: break-all;
        }


//html

<div class='titleShow'></div>


//JQuery

//绑定悬浮事件
                $(".div_Data th").unbind();//绑定到向绑定的位置  例如 table->tr
                $(".div_Data th").hover(function () {
                    var offset = $(this).offset();
                    $(".titleShow")
                        .text($(this).text())
                        .show()
                        .css({ top: offset.top + $(this).outerHeight(), left: offset.left + $(this).outerWidth() / 2 - 50 });
                }, function () {

                });