程序员经验分享-hwhale

在 Chrome 中，为什么 SVGforeignObjects 不缩放相对定位的内容？

2023-11-23

我在 SVG 中使用相对定位的 HTML 元素foreignObject。然而，在 Chrome 中，相对定位的内容并不尊重scale() or viewBox。因此，它的尺寸不合适。

这是我在 jsFiddle 上遇到的问题的示例。所有三个文本片段对于最终用户来说应该显示相同的大小......但在 Chrome 中却不然。

这是什么原因造成的？

Firefox 屏幕截图（如预期？）

The jsFiddle in Firefox

Chrome 屏幕截图（错误？）

The jsFiddle in Chrome


从

24 个相关错误foreignObject在 WebKit 跟踪器和

19 相关问题foreignObject在 Chromium 追踪器上，

看来这很可能是无意的行为。我鼓励您查看 WebKit bug 列表，看看这个问题是否已知。如果不是，请尝试在另一个 WebKit 浏览器上重现此错误。如果问题可以重现，例如Safari，将其作为 bug 提交给 WebKit；如果没有，请将其作为错误提交给 Chromium。

我的猜测是这是一个 WebKit bug；this bug看起来有点相似。

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

Googlechrome

SVG

在 Chrome 中，为什么 SVGforeignObjects 不缩放相对定位的内容？ 的相关文章

  • 谷歌浏览器不显示一个网站的alert()弹出窗口

    我正在开发一个 javascript 循环 该循环会随着循环的进行而提醒每个键值 为了加快速度 我选中了 阻止此页面创建其他对话框 框 通常这只会抑制一个例程的弹出窗口 但它们还没有回来 在 Google Chrome 中 alert 消息

  • 输入数字最大属性调整字段大小

    当在 Chrome 中向输入数字字段添加最大值时 它将根据最大值的宽度重新调整字段的大小 看来我无法控制调整大小的行为

  • 监听服务响应 JavaScript

    背景 我正在为网页制作 Chrome 扩展程序 在此网页中 我需要捕获用户发出 POST 请求时服务器发送的响应 目前 我们使用观察者模式来检查 HTML 页面上的更改 但这很笨拙并且会触发多次 客观的 我需要捕获该响应 相应地解析其信息

  • 网络音频 API：查找、播放/缓冲进度

    当您使用 Chrome 中的音频元素播放音频时 您会听到烦人的咔嗒声和破裂声 至少在我的 64 位 Linux 安装下 即使在我格式化并安装了新的 Fedora 版本之后也是如此 Firefox 和 Opera 都可以 甚至 Virtual

  • 在 HTML5 中使用 JS 创建内联 SVG

    我正在使用本地 HTML5 文件 它有在顶部 我在里面放了这样的东西

  • 为什么 HTML5 视频无法在 google chrome 上运行？

    my code

  • Highcharts - 使用选定的饼图切片获得 3D 效果

    在 highcharts 中 我试图使当用户选择或将鼠标悬停在饼图的切片上时 该切片会产生沿 z 轴 朝向用户 上升的效果 我试图通过 css 设置阴影过滤器并使切片的边框更宽 填充颜色相同 来实现此目的 然而 我面临的问题是切片仍然可以位

  • 自定义 SVG 未加载到我的图像标签中

    目前我正在尝试将自定义 svg 组件加载到图像标签内 但由于某种原因 我无法看到地图组件内的 svg 图像 我的自定义 SVG 文件如下所示 我在 SVG 中加载另一个图像

  • 海量矢量资源导入Android Studio

    有没有办法将许多矢量 svg 图像导入到项目中 导入 30 多个图标有点无聊而且相当愚蠢 Android Studio 使用哪个脚本来转换 svgs 现在 Android Studio 中可以实现这一点 在左侧的资源管理器中 效果很好

  • 从 bash 从新的 Google Chrome 浏览器会话获取“用户代理”字符串

    我想要得到用户代理 HTTP 请求标头 https developer mozilla org en US docs Web HTTP Headers User Agent来自 bash 的新 Google Chrome 浏览器会话 刚刚打

  • 从控制台检查 chrome 版本

    有没有办法从控制台检测 Google Chrome 的版本 我知道我可以解析用户代理字符串 但我更喜欢更简洁的方式 这是我目前拥有的 var uaStr navigator userAgent toLowerCase var index u

  • GeoJson 世界数据库 [关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我正在开发一个项目 需要使用 d3 js 显示国家和城市的地图 实际上 D3支持GeoJson格式 通常

  • 为什么 Web Worker 性能在 30 秒后急剧下降？

    我正在尝试提高在网络工作人员中执行时脚本的性能 它旨在解析浏览器中的大型文本文件而不会崩溃 一切都运行得很好 但我注意到使用网络工作者时大文件的性能存在严重差异 于是我做了一个简单的实验 我在同一输入上运行脚本两次 第一次运行在页面的主线程

  • 获取特定选项卡的 URL？

    在 Google Chrome 中 如何获取特定选项卡上显示的页面的 URL 这取决于你如何定义特定选项卡 有许多功能可以获取选项卡 从而返回一个选项卡选项卡对象 http code google com chrome extensions

  • JW Player javaScript API 不工作

    我使用 jwplayer version 5 10 2295 和浏览器 chrome 25 My code jwplayer container setup file path width 300px height 100px autost

  • 如何在不阻止触摸启动的情况下防止“过度滚动历史导航”？

    我正在实现基于滑动的导航 但我在使用 Chrome 时遇到了麻烦 当页面向右拖动时 会触发新实现的功能 过度滚动历史导航 从而导致跳回 到 历史 1 为了防止这种情况 我必须打电话 preventDefault on touchstart

  • 从 Chrome 扩展中访问响应负载/数据

    我正在开发一个项目 需要跟踪来自某些站点的 ajax 请求 访问其中一些请求的响应负载并对其采取行动 到目前为止 我设法使用以下命令跟踪请求并访问它们的标头网络请求 API http developer chrome com extensi

  • 如何在 SVG 中显示 unicode？

    以 SVG 格式存储在数据库中的信息 如果数据包含文本 它将显示为 Unicode 有必要在浏览器中正确显示 SVG 文件

  • 为什么这个 JS 创建的 SVG 在 Chrome 中不起作用？

    考虑这个简单的 SVG SMIL 动画

  • 不使用控件时，视频元素在 Chrome 中消失

    So I think这是一个浏览器错误 它出现在一个更复杂的设计 网站中 但我已经进行了很好的尝试 简化了我的代码和设计等 并发现了以下内容 嵌入时

随机推荐

  • 检查字符串是否为unix时间戳

    我有一个字符串 我需要找出它是否是 unix 时间戳 我怎样才能有效地做到这一点 I found 这个线程通过谷歌 但恐怕没有给出一个非常可靠的答案 是的 我抄袭了上述帖子中原始海报的问题 好吧 摆弄了一段时间后 我用以下命令撤回了解决方案

  • 在 xaml 中创建自定义 VisualState 并在 CodeBehind 中手动设置

    我有一个 TabItem 样式 其中有 VisualStates

  • 如何在 C++11 constexpr 中检查双精度位模式是否为 0x0？

    我想检查给定的双精度 浮点变量是否具有实际的位模式 0x0 别问为什么 Qt 中的一个函数中使用了它 qIsNull 我想成为constexpr 原始代码使用了联合 union double d int64 t i u u d d retu

  • 我正在寻找一种简单的矩阵 [NxM] 快速 DCT 和 IDCT 算法

    我正在寻找一种简单的算法来快速执行DCT任意大小 NxM 的矩阵 类型 2 以及逆变换算法IDCT 也称为 DCT 类型 3 我需要 DCT 2D 算法 但即使 DCT 1D 算法也足够好了 因为我可以使用 DCT 1D 来实现 DCT 2

  • 如何在asp.net中使用JSON和JQuery从WebMethod返回DataTable？

    我是新来的JSON 我创建了一个示例 它返回String from WebMethod并将返回的值赋给asp net Label控制 返回字符串的 JSON 示例

  • AttributeError：模块“tensorflow”没有属性“get_default_graph”

    我正在做一些与图像字幕相关的任务 并且我已经加载了像这样的初始模型的权重 model InceptionV3 weights imagenet 但我收到这样的错误 AttributeError module tensorflow has n

  • BinaryFormatter 忽略程序集版本

    我有以下方法来生成对象的哈希值 效果非常好 但是 当我更改程序集的版本时 即使对象相同 哈希值也会发生变化 public static string GetHash Object item MemoryStream memoryStream

  • 如何获取Java中特定包中的所有Class文件？

    正如描述所述 如何获取给定包名称的所有 Java 类文件的列表 我在 SO 和其他网站上看到了很多问题和方法来查找特定 Java 包中的所有类 大多数解决方案对我来说都不起作用 有时 他们处理 Jar 文件 但不处理文件夹中的 普通 Jav

  • SSH 的 java.sql.Connection 扩展 [重复]

    这个问题在这里已经有答案了 我有一个位于防火墙后面的 MySQL 数据库 只能通过 SSH 连接访问 有谁知道 java sql Connection 的实现 它允许我与该数据库建立 SSH 连接 您可以使用 SSH 的端口转发来执行此操作

  • templateUrl 不适合我

    我按照 angular io 入门项目使用种子结构 到目前为止一切正常 现在我想更改顶部组件以从单独的文件中查看视图 但我遇到了麻烦 工作代码是 import Component View from angular2 core Compon

  • 不带括号的构造函数调用[重复]

    这个问题在这里已经有答案了 有什么区别吗 var obj1 new Constructor and var obj2 new Constructor 鉴于Constructor是构造函数吗 根据MDN docs new foo 相当于 ne

  • 是否可以确定哪个 Fortran 编译器生成了“.mod”文件？

    假设我的机器上已经安装了一个软件包 我想弄清楚是否需要重新生成模块包含文件 mod 使它们与我的其余编译兼容 有什么办法可以做到这一点吗 我在某些时候遇到了类似的问题 涉及库和模块文件 但没有源 因为在某些情况下 获得正确的编译器比获得重新

  • 使用AppDelegate共享数据

    我找到了一些资料来解释如何使用 AppDelegate 在 iOS 应用程序中的对象之间共享数据 我已经很轻松地实现了它 并且对于我的情况来说这看起来是一个很好的方法 思考什么could使用 AppDelegate 完成 我想知道应该在哪里

  • 在史莱姆中加载新的依赖项？

    我正在使用 emacs 和 swank clojure 我如何解决以下情况 我已向 project clj 添加了新的依赖项 我在 shell 中运行 lein deps 来获取新的 dep 我有一个打开的现有史莱姆会话 并且想要使用新部门

  • Windows PowerShell 在哪里设置 $profile？

    我想移动我的默认 My Documents WindowsPowerShell 文件夹 但是 当我尝试这样做时 PowerShell 当然找不到 profile 是否有一个文件或其他内容可以编辑以将 PowerShell 指向不同的启动文件

  • 当 ajax 调用更改其值时，AngularJS 中的 ng-repeat 列表不会更新

    我完全糊涂了 当 ajax 调用更改其值时 为什么我的 ng repeat 不刷新 我在这里看到了很多问答 但没有一个谈到ajax调用 HTML div class row div class col xs 4 col sm 4 col m

  • 从泛型转换为特定子类

    我有一堂这样的课 public class MyClass

  • 闪亮的数据表：在新窗口中弹出有关所选行的数据

    我有一个闪亮的数据表 当用户选择某一行时 我想在新窗口中根据所选行显示一些其他数据 我尝试使用shinyBS包 但如果没有操作按钮我就无法使用它 而且我不想包含操作按钮 我希望在选择一行时显示弹出窗口 有任何想法吗 mymtcars hea

  • Android 资源 txt 文件的路径

    我正在做 FileReader fin new FileReader file android asset myFile txt 在 Android 项目和许多变体中 在运行时我得到一个文件未找到异常 该文件在资产文件夹中存在且正确 因此我

  • 在 Chrome 中，为什么 SVGforeignObjects 不缩放相对定位的内容？

    我在 SVG 中使用相对定位的 HTML 元素foreignObject 然而 在 Chrome 中 相对定位的内容并不尊重scale or viewBox 因此 它的尺寸不合适 这是我在 jsFiddle 上遇到的问题的示例 所有三个文本

热门标签