Question

我正在为我的页面添加一些新功能，我正在寻找使用bootstrap工具提示，我想要一个使用html的自定义工具提示，但我的代码不能正常工作。这是我的JavaScript：

$("#container").popover({
    html: true,
    title: function() {
        return ("<div color='black'>" + title + "</div>");
    },
    trigger: 'hover',
    content: function() {
        return ("<div color='black'>" + text + "</div>");
    }
});

Title和text是具有某些价值的变量。

Answer 1

所以这是我做过/使用过的一个例子这是css：

 <style>
    .popover-title{
        background: #428bca;
        color:  #ffffff;
    }
</style>

这是html：

<a rel="popover" id="test" data-color="yellow" title="My Title" data-placement="top"
                                data-content="Say something!" >

这将是javascript：

$(document).ready(function() {
    setTimeout(function(){$('#test').popover('show');},5000);
    setTimeout(function(){$('#test').popover('hide');},15000);
    $('body').click(function(e) {
        $('#test').popover('hide');
    });
    $('#test2').hover(function(){
                if ($("#popoverTrigger").next('div.popover:visible').length){
                    $('#test').popover('hide');
               }else{
                     timer1 = setTimeout(function(){$('#test').popover('show');},900);
                     timer2 = setTimeout(function(){$('#test').popover('hide');},4800);
                    }
               },
               function(){clearTimeout(timer1); clearTimeout(timer2); $('#test').popover('hide');
               });
});

这里发生的是我某个div中某个位置的弹出窗口。然后它在5秒后出现。 15秒后它消失了。如果在页面上注册了点击，它也会消失。还有一种悬停方法

我试图从bootstrap创建一个默认弹出窗口

1 个答案: