【问题标题】:Open nyroModal window inside qTip在 qTip 中打开 nyroModal 窗口
【发布时间】:2012-04-26 01:55:52
【问题描述】:

我正在使用 qTip2,我的工具提示之一在标签 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')                  
},

【问题讨论】:

    标签: jquery qtip nyromodal qtip2


    【解决方案1】:

    我不知道 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>
    

    【讨论】:

    • 已更改:内容:{ text: $('.qTipContent') } 它有所帮助:)
    猜你喜欢
    • 1970-01-01
    • 2011-02-14
    • 1970-01-01
    • 2014-03-24
    • 1970-01-01
    • 1970-01-01
    • 2023-02-26
    • 2022-01-22
    • 1970-01-01
    相关资源
    最近更新 更多