当有人将光标移到图像上时如何创建弹出框？答案

【问题标题】：how to create a popover when someone move cursor over an image?当有人将光标移到图像上时如何创建弹出框？
【发布时间】：2013-11-26 00:57:57
【问题描述】：

当有人将光标移到图像上时，我想显示一个带有一些链接和信息的可移动弹出框。我正在使用 Bootstrap 3。

这是一个例子....http://99designs.com/logo-design/contests/logo-design-naming-contest-25538/entries#contest-breadcrumbs

在此示例中，当有人将光标移到图像上时，会出现一个弹出框。

我想创造这样的东西。

                                .............Sohag

【问题讨论】：

您尝试了什么，为什么没有成功？
用户模式弹出控件
你总是可以通过检查他们的脚本来检查这个人正在使用什么，或者你可以找到一些 jquery 工具提示插件。

标签： javascript jquery twitter-bootstrap popover

【解决方案1】：

尝试使用tooltipster 或者您可以为此创建自己的jquery 函数。此链接将对您有所帮助。

tooltip image

tooltipster

如果你准备花 6 美元，那么这个插件真的很不错。

codecanyon smart image tooltip

【讨论】：

【解决方案2】：

试试这个

HTML

<a href="https://www.google.com/images/srpr/logo11w.png" class="fancybox" rel="gallery"><img src="https://www.google.com/images/srpr/logo11w.png"></a>

JavaScript

$("a.fancybox").fancybox({
 'showCloseButton': false
 }).hover(function() {
  $(this).click();
  $(".fancybox-overlay").mouseout(function() {
    $.fancybox.close();
  });
});

Demo

【讨论】：