php中bootstrap框架.popover弹出框,鼠标移动到上面自动显示,离开自动消失

<div rel="name"></div>

<script>
$(function(){//显示弹出框
$("[rel=name]").popover({
trigger:'manual',
placement : 'bottom', //placement of the popover. also can use top, bottom, left or right
title : '弹出框中标题', //this is the top title bar of the popover. add some basic css
html: 'true',
content:'<div style="text-align:center; color:black; font-size:10px;">弹出框中内容</div>',
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);
});
});
</script>

posted on 2018-05-29 10:06  七七2020  阅读(348)  评论(0编辑  收藏  举报

导航