Want more features on Pastebin? Sign Up, it's FREE!
Guest

Untitled

By: a guest on Sep 23rd, 2013  |  syntax: None  |  size: 1.90 KB  |  views: 38  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. $('iframe').load(function(){
  2.   $(this).qtip(
  3.   {
  4.     content: 'My first Qtip! Look mom!',
  5.     show: {
  6.       when : {
  7.          target: $(this).contents().find('.tipoff') // Element within the iframe
  8.       }
  9.     },
  10.     hide: {
  11.       when : {
  12.          target: $(this).contents().find('.tipoff') // Element within the iframe
  13.       }
  14.     }
  15.   });
  16. });
  17.        
  18. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  19.         "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  20. <html xmlns="http://www.w3.org/1999/xhtml">
  21. <head>
  22.     <title>Title</title>
  23.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  24.     <style type="text/css">
  25.         iframe {
  26.             border:1px dashed red;
  27.         }
  28.     </style>
  29.     <link rel="stylesheet" type="text/css" href="jquery.qtip.min.css"/>
  30.     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
  31.     <script src="jquery.qtip.min.js"></script>
  32.     <script type="text/javascript">
  33.  
  34.         $(function() {
  35.             $('p a.tip').qtip({
  36.                 content: 'foo'
  37.             });
  38.  
  39.             $('iframe').load(function() {
  40.                 var position = $(this).position();
  41.                 var top = position.top;
  42.                 var left = position.left;
  43.                 $(this.contentDocument).find('p a.tip').qtip({
  44.                     content: 'bar',
  45.                     position: { adjust: { x:left, y:top } }
  46.                 });
  47.             });
  48.  
  49.             $('#click').click(function(){
  50.                 $('iframe').attr('src', 'test.html');
  51.                 return false;
  52.             });
  53.         });
  54.  
  55.     </script>
  56. </head>
  57. <body>
  58.     <p><a class="tip" href="#">Lorem ipsum dolor</a> sit amet, consectetur adipiscing elit.</a></p>
  59.     <iframe></iframe>
  60.     <p><a href="#" id="click">Load iFrame</a></p>
  61. </body>
  62. </html>
  63.        
  64. <p><a class="tip" href="#">Duis massa metus</a>, convallis vitae, mollis vel, feugiat vitae, nunc.</p>
clone this paste RAW Paste Data