javascript - Bootstrap 的面板和矢量图，隐藏所有不在面板内的东西

Question

我有一个矢量 SVG 图像，它大于我的面板宽度，我会通过 CSS - 或更智能的东西 - 隐藏面板内未包含的所有内容。这是一个 plunk

<div class="panel panel-default">
  <div class="panel-heading">
    Timeline 
  </div>
  <div ui-view="timeline" class="ng-scope">
    <div class="panel-body ng-scope">
      <div id="target1">
        <div class="chronoline-wrapper chronoline-draggable">
          <div class="chronoline-canvas" style="height: 180px; position: absolute; left: 0px; top: 50px;">
              <! -- SVG related tags -->
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

Answer 1

所以你想要一个 overflow: hidden 用于你的 Canvas ？我调整了你的笨拙来处理 Canvas 的溢出和左/右元素的定位。 PLUNK