当我从一个隐藏的div（相对于title属性）采集内容时，如何向cluetip工具提示添加标题

Question

我am using cluetip这很好用，但其中一个工具提示的内容变得非常大，所以我想移动它从本地标题属性中被分成独立和隐藏的div。

这工作正常，除了我无法弄清楚如何将标题添加到工具提示的事实。当我有title属性内容这里是我的提示代码：

$('#subscribe').cluetip({ 
    cluetipClass: 'jtip', 
    activation: 'click', 
    topOffset: 10, 
    leftOffset: -175, 
    splitTitle: '|', 
    sticky: true, 
    closePosition: 'title', 
    arrows: true 
}); 

，这里是我的新代码隐藏的div：

$('#subscribe').cluetip({ 
    local:true, 
    cluetipClass: 'jtip', 
    activation: 'click', 
    topOffset: 10, 
    leftOffset: -175, 
    sticky: true, 
    closePosition: 'title', 
    arrows: true 
}); 

正如你可以看到splitTitle：“|”消失和地方：真被添加（因为它看起来像提示是空的，如果我有“splitTitle”使用本地时：真正

既然我不能使用splitTitle，我怎么能有一个title在我cluetip工具提示的顶部，当我从一个隐藏的div获取工具提示在网站的演示示例中，似乎没有一个使用隐藏div的示例显示标题

Answer 1

您可以设置通过在工具提示触发元素上设置“标题”属性来提供工具提示标题属性。所以，你的HTML看起来像

<!-- your trigger -->  
<a class="load-local" href="#loadme" rel="#loadme" title="Put your tooltip title here"> 
    I trigger tooltip 
</a> 
<!-- your local tooltip --> 
<div id="loadme"> 
    this is hidden local content 
</div> 

Answer 2

您无法使用插件原样

该插件生成以下HTML标记：

<div id="cluetip"> 
    <div class="cluetip-outer"> 
     <h3 class="cluetip-title /> 
     <div class="cluetip-inner" /> 
    </div> 
</div> 

纵观插件的源代码（GitHub）：

/*************************************** 
* load an element from the same page 
***************************************/ 
     } else if (opts.local) { 
     var $localContent = $(tipAttribute + (/^#\S+$/.test(tipAttribute) ? '' : ':eq(' + index + ')')).clone(true).show(); 
     if (opts.localIdSuffix) { 
      $localContent.attr('id', $localContent[0].id + opts.localIdSuffix); 
     } 
     $cluetipInner.html($localContent); 
     cluetipShow(pY); 
     } 
    }; 

的“本地内容”（从您在您的情况DIV）被追加到$cluetipInner作为元件div.cluetip-inner。 <h3>元素被完全忽略。

---

注：有关splitTitle选项，文档说：

splitTitle：如果使用的话，则clueTip将由title属性填充只

Answer 3

就像米哈尔说，这里的解决方案：

http://jsfiddle.net/adaz/6jfDc/