Question

我想知道每次调用时是否可以更改弹出窗口的位置。当我将鼠标悬停在一张照片上时，我会使用它们，并且我有两张并排的照片，所以如果我为第一张照片设置了边距，那么第二张照片会看起来太远。这就是我用来改变定位的方法。

popover.right{
  margin-left: 50px;
}

example1 example2

正如你所看到的50px太多而且弹出窗口比我的菜单边框更右边。我想知道是否可以在每次创建弹出窗口时更改弹出窗口的位置，使它们出现在同一垂直线上。

这里有一些代码： HTML：

<table>
                <tr>
                    <td><a rel="popover"  data-img="nuotraukos/cluemaps/Map_clue_McGrubors.png" ><div><img  class="mapFoto" src = "nuotraukos/cluemaps/Map_clue_McGrubors.png" onClick = "onClick(0,0)"></div></a></td>

                    <td><a rel="popover" data-img="nuotraukos/cluemaps/Map_clue_McGrubors.png" ><div><img  class="mapFoto" src = "nuotraukos/cluemaps/Map_clue_McGrubors.png" onClick = "onClick(15,15)"></div></a></td>
                </tr>
                <tr>
                    <td><a rel="popover" data-img="nuotraukos/cluemaps/Map_clue_McGrubors.png" ><div><img  class="mapFoto" src = "nuotraukos/cluemaps/Map_clue_McGrubors.png" onClick = "onClick(0,0)"></div></a></td>

                    <td><a rel="popover" data-img="nuotraukos/cluemaps/Map_clue_McGrubors.png" ><div><img  class="mapFoto" src = "nuotraukos/cluemaps/Map_clue_McGrubors.png" onClick = "onClick(0,0)"></div></a></td>
                </tr>
            </table>

JS：

$('a[rel=popover]').popover({
  html: true,
  trigger: 'hover',
  placement: 'right',
  content: function(){return '<img src="'+$(this).data('img') + '" style=\'width:100%\'  />';}
});

CSS：

.popover.right {
  margin-left: 50px;
}

Answer 1

我认为您需要在代码中提及更多参数。查看this以获取更详细的信息。关于它这里：Link

希望有所帮助;）

CSS bootstrap多个popovers的不同定位

1 个答案: