javascript - 如何启用 Safari 滚动 SVG(滚动 div 中的对象标签)?

标签 javascript css object svg safari

我有以下代码来显示一系列投资组合图片,这些图片以 SVG 格式存储在滚动 div 中:

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

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

该页面在 Chrome 和 Firefox 中的行为符合预期(滚动在任何地方都有效)。

是否有特定于 Safari 的 CSS 标记,使滚动事件能够通过 SVG 传递?

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

[临时] 我正在处理的页面是 here .

最佳答案

如果您知道 SVG 文件的高度(我想您知道),只需将总高度添加到此即可:

<div id=content>

例如每张图片高 300 像素,添加样式:

#content { height: 900px; }

然后外部应该滚动

如果您不知道高度,则测量它们onload 并在加载时动态添加高度#content div

关于javascript - 如何启用 Safari 滚动 SVG(滚动 div 中的对象标签)?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28323692/

相关文章:

javascript - React.js 切换显示

javascript - angularjs 在 html 元素上动态设置 css

javascript - jQuery:正确循环对象?

javascript - 如何使用 Javascript 将数据写入 JSON 文件

javascript - react : I have some error with edit state from reducers

javascript - 更新 Svelte : Package subpath './compiler.js' is not defined by "exports" 后生成错误

javascript - 如何在 JSP 中转义 JavaScript?

css - 向特定行添加悬停颜色

php - 如何从函数返回对象?

javascript - 如何获取Google Analytics访客唯一ID?