0

我目前正在编写一个脚本,该脚本允许用户在 SVG 文档中嵌入 JavaScript 文件,以实现内容的平移和缩放。我已经尝试了几乎所有可以找到的 SVG 平移和缩放变体,并且只找到了一种具有一致的跨浏览器支持的变体。不幸的是,该脚本是在假设 SVG 将在 HTML 中写出而不是通过 object 标记嵌入的情况下编写的。由于我正在使用很多预渲染的 SVG,因此仅链接到每个 SVG 中的外部 JavaScript 文件会更有效。到目前为止,转换一切顺利,但我遇到了一些障碍。该脚本依赖于鼠标事件点击包装 SVG 对象的 div。它如下所示:

<div id="svgwindow">
  <div id="wrapper">
    <object id="svg" data="test.svg" type="image/svg+xml"></object>
  </div>
</div>

JavaScript 的一个例子:

parent.document.getElementById("svgwindow").addEventListener("mousewheel", Zoom, false);

只要事件发生在 svg 对象未填充的 svgwindow 区域中,此脚本就会成功添加事件。一旦事件发生在对象之上,就不会捕获该事件。我无法找到任何类似的实例来帮助解决错误,所以任何帮助都会很棒。

4

1 回答 1

0

由于<object>标签将捕获所有事件并且无法阻止它,您所能做的就是将另一个绝对定位在将接收事件<div>的包装器的顶部。<div>

当然,如果您换成一个<image>标签而不是一个<object>不会捕获事件但对图像有限制的标签,例如所有数据必须在一个文件中,并且不允许编写脚本,这可能会使其不适合您。如果它合适,那么这是最简单的方法。

于 2013-04-03T19:18:32.003 回答