1

我在 iframe 中使用 jQuery qTip2 但由于我受限于 iframe 宽度和高度的大小,无论如何我可以让内容实际出现在 iframe 的顶部,即在 iframe 的父窗口内而不是在实际的 iframe 本身?

这样,我就不受 iframe 大小的限制了。

这是我作为 iframe 的一部分使用的当前代码:

$(document).ready(function() {
   $('img[title]').qtip({
         content: {
            text: false, // Use each elements title attribute
            title: {
              text: 'Error',
              button: 'Close'
            }
         },
         hide: {
           event: false
         },
         style: {
            classes: 'ui-tooltip-dark ui-tooltip-rounded',
            height: 5,
            width: 500
         },
         position: {
            my: 'bottom right',
            at: 'top left'
         }
   });
});
4

2 回答 2

3

克雷格在 qTip2 论坛中发布了一个链接来回复您的同一篇帖子,该帖子回答了您的问题:

http://craigsworks.com/projects/forums/thread-solved-qtip-in-iframe-and-mouse-tracking

通过阅读讨论,简短的回答是您必须从父文档初始化 qTips,jQuery 使这很容易。最困难的部分是您必须处理 Javascript 的同源策略。换句话说,两个文档必须来自同一个域。如果没有,那你就不走运了。

另一个警告是,您必须手动调整 qTip 位置,因为您是从父文档初始化的。

这是一个工作示例:

http://fiddle.jshell.net/4QDcz/1/

$(document).ready(function () {

    $('#theFrame').contents().find('.selector').qtip({
        position: {
            adjust: {
                x: $('#theFrame').offset().left,
                y: $('#theFrame').offset().top
            }
        }
     });

});
于 2011-09-13T08:08:53.093 回答
0

我想知道设置视口是否可以解决您的问题。像这样的东西:

position: {
             my: 'top center',  // Position my top left...
             at: 'bottom center', // at the bottom right of...
             viewport: $(window)
          },
于 2011-08-26T09:31:58.253 回答