在鼠标悬停时打开iFrame的弹出窗口 [英] Opening a popup with iFrame on mouseover

问题描述

我正在处理这个需要此功能的项目。
当我将鼠标悬停在图片上时，应该打开一个旁边的小框（如工具提示）并在其中加载链接（可能是iFrame）。

 < script> 
 $（function（）{
 $（document）.tooltip（）; 
}）; 
< / script 
  

我尝试通过tooltip执行此操作它可以打开一个小盒子并加载一个iFrame），但是没有工作，以及。
由于我在JavaScript / jQuery中的有限的知识。我找不到任何可行的解决方案。

我应该怎么做才能像require一样工作？

b

> 演示

the html：

 < div id =hoverMe>将鼠标悬停在此处< / div& 
< iframe id =tooltipsrc =http://jsfiddle.net>< / iframe> 
  

jQuery：

  $（'＃hoverMe'）。hover（function（）{
 $（'＃tooltip'）。fadeIn（）; 
}，function（）{
 $（'＃tooltip'）。fadeOut（）; 
}）; 
  

I'm working on this project which requires this feature. When I hover over an image, it should open a small box next to it (like tooltip) and load a link there (probably an iFrame).

 <script>
  $(function() {
    $( document ).tooltip();
  });
  </script

I tried to do this via tooltip (tried manipulating the tolltip so that it could open a small box and load an iFrame), but that didn't work as well. Due to my limited knowledge in JavaScript/ jQuery. I couldn't find any viable solution.

What should I do to make it work like require ?

Any suggestions are appreciated.

解决方案

you could do something like this

Demo

the html:

<div id="hoverMe">Hover over here</div>
<iframe id="tooltip" src="http://jsfiddle.net"></iframe>

the jQuery:

$('#hoverMe').hover(function () {
    $('#tooltip').fadeIn();
}, function () {
    $('#tooltip').fadeOut();
});

这篇关于在鼠标悬停时打开iFrame的弹出窗口的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！