如何在SVG上启用Safari滚动(滚动div中的对象标签)？

Question

我有以下代码来显示在滚动div中存储为SVG的一系列投资组合图像：

<div style="overflow:scroll;width:500px;height:500px">
  <object src=image1.svg></object>
  <object src=image2.svg></object>
  <object src=image3.svg></object>
</div>

当光标位于其中一个SVG上时，使用两根手指或鼠标滚轮在Safari中滚动是不起作用的。

页面在Chrome和Firefox中的行为与预期一致（滚动在任何地方都有效）。

是否有Safari特定的CSS标记可以使滚动事件通过SVG

SVG是在对象标记中绘制的，因为它们包含一些位图元素，如果在基于webkit的浏览器中在img标记中调用这些元素，这些元素将不会显示。

[临时]我正在处理的页面就在这里。

Answer 1

如果您知道SVG文件的高度（我认为您知道），只需将总高度添加到以下内容中即可：

<div id=content>

例如，每个图像都有300像素高，添加样式：

#content { height: 900px; }

然后外部应该滚动

如果您不知道高度，则测量它们的onload，并在它们加载时动态添加高度#contentdiv

到目前为止，我提出的最佳答案是将透明图像放置在SVG的顶部。

<img id=scroller src=spacer.gif
  width=500px height=10000px
  style="position:absolute;top:0px;left:0px">