使用Twitter Bootstrap" bootstrap-popover.js"启用Popovers。在Rails 3.2中

时间:2012-05-17 16:51:17

标签: javascript twitter-bootstrap ruby-on-rails-3.2

Ruby on Rails和Twitter Bootstrap的新手:P

尝试向图像添加弹出窗口,当您滚动图像时,弹出窗口会显示较大版本的图像。

图片:

<ul class="thumbnails">
  <div class="span1">
    <ul>
     <li>
      <a href="#" class="thumbnail"><img src="http://placehold.it/125x100" alt=""></a>
     </li>
  </div>
    </ul>

我正在尝试使用Twitter Bootstrap的“Popovers”,将“bootstrap-popover.js”和“bootstrap-tooltip.js”(它扩展)添加到我资产目录中的相应文件夹中(使用Rails 3.2)。

如果我想激活它以便在我滚动图像时弹出窗口有效,我该怎么做?

我真的只是不确定如何调用popover的特定元素来处理。

What I'm trying to make happen :)

非常感谢!!!

1 个答案:

答案 0 :(得分:2)

在您链接javascript文件的任何地方放置此javascript语句。这将激活所有'a'元素的弹出窗口(页面中的链接)。

$('a').popover(placement:'top');

尝试使用此代码进行测试。在链接标记中设置rel,title和data-content属性将激活该元素上的popever。

<ul class="thumbnails">
  <div class="span1">
    <ul>
     <li>
      <a href="#" rel="popover" title="A Title" data-content="<img src='http://placehold.it/125x100'/>">Hover over me for image.</a>
     </li>
  </div>
</ul>