qTip2 dans un iFrame

Question

J'utilise jQuery qTip2 dans un iframe mais comme je suis limité à la taille de la largeur et de la hauteur de iframe, est-ce que je pourrais avoir le contenu en fait sur le iframe, ie dans le parent fenêtre de l'iframe et pas dans l'iframe lui-même?

De cette manière, je ne suis pas limité à la taille de l'iframe.

Ceci est le code actuel que j'utilise dans le cadre de l'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' 
     } 
    }); 
}); 

Answer 1

Je me demande si la configuration du port de vue résoudra votre problème. quelque chose comme ceci:

position: { 
      my: 'top center', // Position my top left... 
      at: 'bottom center', // at the bottom right of... 
      viewport: $(window) 
      }, 

Answer 2

Craig a posté un lien en réponse à your same post in the qTip2 forums qui répond à votre question:

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

À la lecture de la discussion, la réponse courte est que vous devrez initialiser le qDes astuces du document parent, que jQuery simplifie. La partie difficile de cela est que vous devrez faire face à la same origin policy de Javascript. En d'autres termes, les deux documents doivent provenir du même domaine. Sinon, vous n'avez pas de chance. Un autre inconvénient est que vous devrez ajuster manuellement le positionnement qTip depuis l'initialisation à partir du document parent.

Voici un exemple de travail:

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

$(document).ready(function() { 

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

});