Javascript 使用Twitter引导放大悬停图像

我是bootstrap新手，希望在悬停上使用类img rounded放大所有图像

我是这样实现的：

<div class="container">
  <div class="row">
    <div class="span4">
      <div class="well">
        <img src="MyImage.png" class="img-rounded">
      </div>
    </div>
  </div>
</div>

<script>
  $( document ).ready(function() {
    $('.img-rounded').popover({
      html: true,
      trigger: 'hover',
      placement: 'bottom',
      content: function () {
        return 
          '<img class="img-rounded" style="float:right;width:500px;max-width:500px;" src="
          +$(this)[0].src + '" />';
      }
    });
  });

</script>

$（文档）.ready（函数（）{
$（'.img四舍五入'）.popover({
是的，
触发器：“悬停”，
位置：'底部'，
内容：功能（）{
返回
'';
}
});
});

---

不幸的是，放大图像周围的边界框没有放大。如何解决这个问题

只需使用css就可以轻松做到这一点

#img1{
height:200px;
}
#img1:hover{
height:400px;
}

此外，您还可以根据需要使用更少的代码应用许多附加效果。

---

您还可以相应地管理父div以匹配此css规则。并非所有的东西都需要JS。

这是由于弹出窗口的默认值

最大宽度：276px

造成的。简单地加上

<style type="text/css">
.popover {
    max-width: 1000px;
}
</style>

波弗先生{
最大宽度：1000px；
}

---

（或任何其他值，auto在此不起作用）并且popover将适合图像。

您有我可以查看的演示吗？