Question

我想使用Qtip2来显示持久性工具提示。持久化我的意思是在页面加载时应该显示工具提示，然后在页面的生命周期中既不应该隐藏也不应该销毁它。我尝试过解决方案here，但它对我不起作用。在我可以在jsFiddle here中引用它的代码中，当目标被鼠标悬停时，工具提示仍然是隐藏的。我希望关闭此行为，以便工具提示保持不变。

供您参考，帮助我，代码：

<html>
<head>
    <link href="http://craigsworks.com/projects/qtip_new/packages/nightly/jquery.qtip.css" rel="stylesheet" />
    <link href="mycss2.css" rel="stylesheet" />
    <style>
        #demo-simple{
            margin:100px;
            border:1px red Solid;
        }
    </style>
</head>
<body>
    <div id="demo-simple" class="box">
        <div id="primary">
            Hello World
        </div>
    </div>    
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="http://craigsworks.com/projects/qtip_new/packages/nightly/jquery.qtip.js" ></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#primary").qtip({
                content: {
                    text: 'I am primary'
                },
                show: {
                    ready: false,
                    delay: 0
                },
                hide: {
                    when: false
                },
                position: {
                    my: 'right center',
                    at: 'left center',
                    target: $('#primary')
                },
            });
            $("#primary").qtip('show');
        });
    </script>
</body>

Answer 1

这将使工具提示在页面加载时永久化。 JsFiddle here.

$("#primary").qtip({
    content: {
        text: 'I am primary'
    },
    show: {
        ready: true,
        delay: 0
    },
    hide: false,
    position: {
        my: 'right center',
        at: 'left center',
        target: $('#primary')
    },
});

Answer 2

这就是你想要的，FIDDLE

$(document).ready(function () {
    $("#primary").qtip({
        content: {
            text: 'I am primary'
        },
        show: true,
        hide: false,
        position: {
            my: 'right center',
            at: 'left center',
            target: $('#primary')
        },
    });
});

Answer 3

 show: {
   ready: true,
   delay: 0
 },
 hide: {
   event: 'nonexisting'
 },

http://jsfiddle.net/KHxgQ/8/

持续的Qtip

3 个答案: