7

我会调整 bootstrap 核心中的位置,但我想保持我的 bootstrap-sass gem 可以更新。弹出框偏移没有变量,我只需要偏移 1 种弹出框。

在此处输入图像描述

顶部描述了这个问题。底部是我使用 chrome 开发工具进行的调整。如果我将此更改提交给我的 css,Bootstrap 的动态放置会重新调整,它看起来又像上面的情况。有没有办法让弹出框自动出现在它的父 div 的范围内?如果没有,我如何克服具有负边距的动态弹出框放置?

更新:添加代码。这是按钮组的结果 HTML。第一个链接上的弹出框有效,您可以忽略它。

<div class="btn-group btn-section pull-right">
  <a href="/sections/edit_section_text/118" class="noprint btn active-workers hidden-phone bs-popover btn-primary" data-content="<ul id="sectionworkers" class="unstyled"><li><img alt="Avatar" class="avatar" height="25" src="https://secure.gravatar.com/avatar.php?d=mm&gravatar_id=9ac2c7fd1c8e43cd5b4d73d3cb585973" width="25" /> <small>Ben</small></li></ul> <!-- #sectionworkers -->" data-placement="bottom" data-target="#s118section" id="edit_btn118" rel="popover" data-original-title="Active Users: ">
    <i class="icon-edit icon-white"></i> Edit
  </a><option>View revision...</option>

  <a href="#" class="noprint btn bs-popover" data-content="<select></select>" data-placement="bottom" data-toggle="popover" id="hist_btn" rel="popover" data-original-title="View and difference revisions"><i class="icon-time"></i> History</a>

  <div class="popover popover-offset fade bottom in" style="top: 30px; left: 155.5px; display: block;">
    <div class="arrow"></div>
    <div class="popover-inner">
      <h3 class="popover-title">
        View and difference revisions
      </h3>
      <div class="popover-content">
        <select></select>
      </div>
    </div>
  </div>
</div>
4

2 回答 2

7

在阅读了 Archonic 的 PR 和 FATs 回复后,我调查了他所说的模板。

如果您复制 Bootstrap 的模板并在您的弹出选项中指定它,您可以在此时注入类,这至少解决了我的问题。

$el.popover(
  placement: 'top',
  trigger: 'manual', 
  html: true, 
  content: @popoverContent, 
  container: '#mycontainer',
  template: '<div class="popover my_ace_class_name"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'
)
于 2013-07-04T05:42:16.047 回答
1

在 bootstrap-tooltip.js 中用 2 行修复了它,并将发出拉取请求。这可以添加您想要的任何样式,这可以解决您可能遇到的工具提示或弹出框的任何放置问题。

在 bootstrap-tooltip.js 中,就在this.$element.trigger('shown')in之前show: function (),添加:

$tip.addClass(this.options.class)

然后就在this.$element.trigger('hidden')in之前hide: function (),添加

$tip.removeClass(this.options.class)

然后在初始化工具提示或弹出框时,添加您的样式,如下所示:

$('.bs-popover').popover({html:true, trigger:'click', class:'whatever-you-want'})

然后当然.whatever-you-want在你的css中声明。

它应该比这容易得多-_-。别客气!

于 2013-03-05T20:08:56.423 回答