Bootstrap Popover和图像映射

用户名

http://jsfiddle.net/YsEqb/25/

将鼠标悬停在他的眼睛上。他光荣的眼睛。

我要在这里做的是使弹出窗口的内容显示在他的眼睛上方,而不是图片本身上方。很简单的问题,但是我很难解决这个问题。我知道该插件通常不应该在图像映射中使用,但这是我现在唯一需要处理的事情。似乎我应该可以捏造一些东西。那么,Stackoverflow,您能帮我些软糖吗?

这是一个占位符图像,实际代码将在页面中使用,根据用户的操作,图像可能位于不同的位置。并且将会有不止一个调用同一张地图。因此,它必须出现在称为地图的特定图像上。

谢谢大家

{如果没有任何代码,我将无法提交。这是我正在使用的JavaScript。}

       $(document).ready(function() {
     $('#eye').popover({
        placement : 'top'
    });
  $('#eye2').popover({
        placement : 'top'
    });
});
用户名

对于那些感兴趣的人,这是我解决这个问题的方法。

我决定抛弃该区域地图,以使用更复杂的解决方案。创建一个链接标签,其中包含所有元素以显示弹出窗口,并将其显示为嵌入式块。将其相对于其所在的容器进行绝对定位。然后将其置于眼睛所在的位置。没有圆,但是看不见的正方形也一样。谁会注意,是吗?它比我喜欢的重复代码要多得多,但是它可以正常工作,并且不会使页面速度降低太多。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

Bootstrap 3 Popover箭头和框的位置

来自分类Dev

如何获得Bootstrap Popover高度?

来自分类Dev

Bootstrap Popover和Rails

来自分类Dev

Selenium ElementNotVisibleException for Bootstrap Popover

来自分类Dev

bootstrap popover为文本和图像添加单独的数据属性

来自分类Dev

Bootstrap Popover Border CSS

来自分类Dev

Bootstrap Popover Border CSS

来自分类Dev

悬停在图像选择器中的bootstrap popover

来自分类Dev

Bootstrap Popover和工具提示不起作用

来自分类Dev

Bootstrap Popover不会保存ckeckbox

来自分类Dev

Bootstrap Popover中的单击和按钮警告问题

来自分类Dev

Bootstrap Popover视口属性

来自分类Dev

带有Bootstrap工具提示的图像映射未正确显示

来自分类Dev

Ajax的Bootstrap Popover

来自分类Dev

Bootstrap Popover在中间对齐

来自分类Dev

Bootstrap Popover不起作用

来自分类Dev

Bootstrap Popover不适用于下载的js和CSS

来自分类Dev

Bootstrap Popover问题

来自分类Dev

bootstrap 3.0 popover('hide')方法:不适用于多个popover内容和标题未删除

来自分类Dev

Selenium ElementNotVisibleException for Bootstrap Popover

来自分类Dev

Bootstrap popover指令和Angular.js的嵌套元素

来自分类Dev

使用Bootstrap相对响应文本和图像

来自分类Dev

AngularJS Bootstrap Gallery横向和纵向图像

来自分类Dev

Bootstrap Popover和Modal(悬停并单击)

来自分类Dev

LI中的Bootstrap Popover

来自分类Dev

Bootstrap Popover功能

来自分类Dev

Bootstrap Div,文本和图像(对齐)居中

来自分类Dev

bootstrap carousel 中心图像垂直和水平

来自分类Dev

使用 bootstrap 使图像垂直和水平居中