jQuery qTip - 从工具提示中链接到隐藏的div

Question

我正在尝试在工具提示（qTip）中放置一个链接，点击该链接时会显示灯箱内的隐藏div的内容（nyroModal）。不在工具提示中的常规锚标记会成功链接到灯箱中的div打开内容。

代码：http://jsbin.com/omafe/2/

可能需要将代码复制到记事本，另存为html并打开文件。 （jsbin没有加载外部js插件文件）

非常感谢任何帮助。感谢。

Answer 1

似乎qTip在内存中存储了'div.tipcontent'的副本（变量）。

我通过从div中删除“隐藏”类来发现这一点。当你这样做时，你会看到你有两个div。一个仍在页面上，另一个由qTip在内存中使用。

作为解决方案，您可能必须修改qTip以将$('a').nyroModal();应用于它从内存呈现的链接节点。

修改

要将灯箱效果添加到qtip链接，请按如下所示修改qtip初始值设定项：

$('div.tooltip').qtip({
    content: $('div.tipcontent').html(),
    position: {
        corner: {
        target: 'topRight',
        tooltip: 'bottomRight'
        }
    },
    style: { 
        width: 150,
        padding: 10,
        background: 'silver',
        color: 'black',
        tip: 'bottomMiddle',
    },
    hide: {
        fixed: true
    },
    api: {
        onShow: function() { $('a').nyroModal(); }
    }
});

请注意api对onShow的调用。这将重新将nyroModal应用于页面上的所有链接，从而覆盖动态生成的qtip内容。可能有一种更有效的方法可以将jQuery选择器缩小到qtip生成的特定链接，但这应该至少让你开始。