我有以下代码来显示一系列投资组合图片,这些图片以 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/