鼠标出现在文字上时显示内容

来源：互联网发布：淘宝第三方服务商编辑：程序博客网时间：2024/04/29 03:31

当鼠标出现在文字上时显示内容

依赖的js包括：jquery.js、bootstrap.min.js;

样式库：bootstrap.min.css

<body><p style="padding-top: 50px"><a href="#" rel="drevil" >信息</a></p></body>

    $(function(){      $("[rel=drevil]").popover({        trigger:'manual',        placement : 'right',        title : '<div style="font-size:14px;width: auto;max-width: 200px;">信息</div>',        html: 'true',        content: function() {          return $(this).attr('data-contentStr');        },        animation: false      }).on("mouseenter", function () {        var _this = this;        $(this).popover("show");        $(this).siblings(".popover").on("mouseleave", function () {          $(_this).popover('hide');        });      }).on("mouseleave", function () {        var _this = this;        setTimeout(function () {          if (!$(".popover:hover").length) {            $(_this).popover("hide")          }        }, 100);      });    });

0 0