jQuery Tools - 工具提示問題

在此處有工具提示問題。希望有人可以幫助調整一下代碼。我使用的是jQuery Tools for implementing a tooltip。我需要工具提示從單獨的div打開，我可以使用任何html代碼。到目前爲止，我只有一個提示打開：jQuery Tools - 工具提示問題

<script src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script> 

<script> 
    $(document).ready(function() { 
     $("#download_now").tooltip({ 
      offset: [5, 0], 
      effect: 'slide' 
     }).dynamic({ bottom: { direction: 'down', bounce: true } }); 

}); 
</script>

而且除了我需要更多的工具提示添加它工作正常。

任何人都可以幫助修改腳本，以便他們的ID可以添加更多的工具提示嗎？

這裏是JSFiddle with one tooltip（工作）

這裏是JSFiddle with more tooltips（不工作）

我相信應該有一個簡單的辦法。我只是不是一個JavaScript專家。

謝謝！

來源

2013-10-18 axidos

好吧，我明白了。我很抱歉，我以爲你使用的是jquery-ui tooltip（根據我的說法，它提供了比你使用的庫更好的小部件）。

通過閱讀the documentation我發現：

這旁邊的觸發器被用作工具提示

也就是說你的提示內容（以HTML爲您指定）的元素需要後放置在你想要一個tootip的元素之後，像這樣：

Lorem ipsum 
<a id="download_now1" class="need_tooltip"> 
    <strong>dolor sit amet</strong> 
</a> 
<div class="tooltip"> 
    <p><strong>Some sample text</strong> with html within...</p> 
</div>

看一看this jsFiddle。

如果你不能直接在你的元素後面放置你的工具提示內容，我會建議你使用jQueryUI，這是更靈活的定義工具提示內容。

編輯提供一個jQuery UI的版本

的jQuery UI的工具提示基本關閉時元素失去焦點，所以你不能懸停提示（點擊裏面的鏈接，例如上）。但是有一種解決方法可以防止工具提示在這種情況下關閉:)。因此我認爲this new jsFiddle正在滿足您的要求。

來源

2013-10-18 22:35:12 rd3n

我知道元素具有唯一的DOM元素標識符。我只是不知道如何修改腳本來實現我的目標。我知道如何使用從標題調用的多個工具提示，但這裏的想法是從div調用內容，我可以添加任何我需要的內容（圖片，文本，鏈接等）。不幸的是，標題不起作用。 – axidos

另外，它不是一個jquery-ui工具提示。這個工具提示是基於不同的庫 - jQuery工具 - http://jquerytools.org/demos/tooltip/any-html.html – axidos

這幾乎是尋找的東西，但我希望所有的div都分開坐在HTML下面用觸發器所以它可以很容易維護。我試圖建立的界面最終將會非常複雜。我也更喜歡jquery-ui工具提示，但無法找到接近此想法的正確演示。如果你能展示如何用jquery-ui解決它，我將不勝感激。如果觸發器可以點擊，這也會有所幫助。並感謝您的幫助！ – axidos

jQuery Tools - 工具提示問題

回答

相關問題