持久性Qtip

我想用Qtip2來顯示持久性工具提示。通過持久性，我的意思是應該在頁面加載時顯示工具提示，然後在頁面的整個生命週期內它不應該被隱藏或銷燬。我試過解決方案here，但它對我不起作用。在我的代碼中，您可以在jsFiddle here中引用它，當目標被隱藏時，工具提示仍然隱藏。我希望此行爲已關閉，以便工具提示保持原位。持久性Qtip

供大家參考，幫助我，代碼：

<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>

來源

2013-05-21 Dav Evans

這將使Ť他在頁面加載時永久提示工具提示。在頁面加載顯示 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') 
    }, 
});

來源

2013-05-21 05:25:42

謝謝布萊恩。很快就會接受。 –

乾杯Dav，很高興它幫助。 –

這是你想要的，FIDDLE

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

來源

2013-05-21 05:22:18

未啓用的提示，我想準備：真正可以解決這個問題。謝謝。 –

@Dav Evans檢查編輯後的代碼和提琴 –

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

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

來源

2013-05-21 05:25:23 Ramunas

回答

相關問題