打开qTip内的nyroModal窗口



我使用 qtip 和我的一个工具提示是在标签div。div里面我有一个链接,应该打开一个nyroModal窗口(ajax页面)。它只打开第一次和下一个,当我悬停并点击链接打开简单的页面,如target="_blank"

这里是一个实时演示:http://jsfiddle.net/Ja9dN/2/

HTML:

<div style="margin:50px 0 0 50px">
    <span class="qTip">Hover to see the Tooltip with Content</span>
    <div class="qTipContent">...<a href="http://craigsworks.com/projects/qtip2/" class="modalBox">This link</a> opens nyroModal window only once ...  </div>
    <p>&nbsp;</p>
    <p><a href="http://craigsworks.com/projects/qtip2/" class="modalBox">This link open window</a></p>

</div>

JS:

$('.qTip').qtip({
               content: {
                  text: function(api) {
                      return $('.qTipContent');
                  }
               },
               position: {
                  my: 'bottom center',
                  at: 'top center',
                  adjust: {y: 0 }
               },
               style: {
                  classes: 'ui-tooltip-light ui-tooltip-shadow ui-tooltip-rounded',
                  width: 390
                  },            
               hide: {
                  delay: 250,
                  fixed: true
               }               
});
$(".modalBox").nyroModal();

感谢

解决:

将内容调用更改为:

content: {
    text: $('.qTipContent')                  
},

我不知道qTip2是如何工作的,或者是否有兼容性问题或…但我认为,一个可能的解释是链接-标签a -和点击处理程序之间的链接的损失,因为刷新的div例如…因此,您可以尝试直接在链接后面插入代码:

<p>
<a href="http://craigsworks.com/projects/qtip2/" class="modalBox">This link open window</a>
<script type="text/javascript">
$(document).ready(function(){   
    $(function() {
        $(".modalBox").nyroModal();
    });
});
</script>
</p>

最新更新