小编War*_*ama的帖子

cloneNode()更改InternetExplorer 10和11中的属性值

当我调用具有该属性cloneNode()的名称的元素时,InternetExplorer(10和11)始终将值转换为.feGaussianBlurstdDeviation1.72443e+009

这是一个说明问题的四线:https://jsfiddle.net/kytbh4Ls/6/

如果您更改元素名称,使用其他属性名称或在任何其他浏览器(Chrome,Firefox)上运行小提琴,一切都按预期运行.使用不同的属性值不会改变任何东西.

这可能是什么原因造成这种奇怪的行为?有什么可以做的吗?

这里使用jQuery clone()代替的改进小提琴cloneNode(),不幸的是产生相同的结果:https://jsfiddle.net/kytbh4Ls/7/

javascript jquery internet-explorer svg clone

9
推荐指数
1
解决办法
362
查看次数

如何以可接受的性能在 Safari 上使用简单的 SVG 过滤器并且不会崩溃?

免责声明:这篇文章是我在试图找到解决方案时的实验的一半问题和一半报告。

任务:单色矩形上的简单 SVG 过滤器

使用过滤器更改或修改 SVG 中单色形状的颜色非常简单。这是如何做到的:

<svg viewBox="0 0 460 130">
  <defs>
    <filter id="filter1">
      <feColorMatrix values="0.5 0 0 0 0 0 0.5 0 0 0 0 0 0.5 0 0 0 0 0 1 0" />
    </filter>
  </defs>
  <g transform="translate(20, 0)">
    <text x="0" y="35">Original</text>
    <rect x="0" y="50" width="200" height="80" fill="red" />
  </g>
  <g transform="translate(240, 0)">
    <text x="0" y="35">Filtered</text>  
    <rect x="0" y="50" width="200" height="80" fill="red" filter="url(#filter1)" />
  </g>
</svg>
Run Code Online (Sandbox Code Playgroud)

 

问题:在 Safari 上运行缓慢,在 Safari Mobile 上崩溃

这样做的小问题是它在 Safari 上真的很慢。在下面的代码段中,每半秒就会向 SVG 添加一个新的过滤矩形。这将最终在 …

safari svg webkit mobile-safari svg-filters

7
推荐指数
1
解决办法
1199
查看次数

OpenType/TrueType 中复合字形的组件

我在OpenType / TrueType glyf表的规范中找不到任何信息来说明复合字形的组件是否总是简单的字形,或者它们本身是否可以是复合字形(即递归复合字形)。

由于规范没有明确禁止复合字形作为组件,我认为理论上这是可能的。但我的问题是:是否有任何字体实际上包含递归复合字形?是否有任何主要的字体工具支持这一点?

背景是我正在编写一个简单的字体解析器,我想知道是否需要了解递归复合字形,因为这会使算法变得更加复杂。

更新:我在maxp table的规范中找到了一些信息。这定义了maxComponentDepth,这是复合字形的最大递归级别。这表明递归复合字形是可能的。但它们真的被使用了吗?

fonts typography truetype opentype

5
推荐指数
1
解决办法
338
查看次数

Chrome Devtools 中调用树和自下而上之间缺少链接

使用 Chrome 开发工具中的性能分析器时,自下而上视图是查找代码中消耗大部分时间的函数的便捷方法。当然,如果能了解时间是如何度过的那就太好了,所以我想查看该函数的调用树,但我找不到这两个视图之间的链接。我必须做的是从根节点手动遍历调用树,直到找到我的函数,这可能是一项相当大量的工作。

这是一个例子。我认为 Coonmessage 是一个花费了大部分时间的函数。

在此输入图像描述

现在我想在“调用树”视图中找到该函数。

在此输入图像描述

有没有简单的方法可以找到该函数?

profiling google-chrome-devtools

5
推荐指数
0
解决办法
1435
查看次数

在角度材质中实现切换按钮的最佳方法

我正在寻找一个简单的解决方案来实现一个切换按钮,其中包含Angular Material中的自定义选定/未选定图标.

该功能应该与md-checkbox相同(使用选择状态的ng-model),但我希望为选定/未选择状态显示我自己的图标.md-checkbox似乎不支持自定义图标,而md-button缺少ng-model.

我希望避免实现自定义指令,只能通过css实现这项工作.这是否可以使用Angular材料?

angularjs angular-material

3
推荐指数
2
解决办法
2万
查看次数

找到导致 Chrome 的 SameSite 警告的 cookie

正如你们中的一些人所知,Chrome 将在本月开始使用新的 SameSite cookie 政策(https://web.dev/samesite-cookies-explained/https://www.chromium.org/updates/same-site)。

我们正在为我们的应用程序使用 Auth0,并且自去年年底以来在 Chrome 的控制台中看到了这个 SameCookie 警告:

在此处输入图片说明

现在,随着新政策的推出越来越近,我尝试使用 Chrome 开发人员工具中的应用程序视图找到有问题的 cookie。这是什么显示:

在此处输入图片说明

如您所见,任何 cookie都没有SecureSameSize条目。

所以我启用了新政策,看看会发生什么变化。这可以在chrome://flags

在此处输入图片说明

在这些更改之后,我在控制台中看到一条消息,告诉我 cookie 被阻止了。

在此处输入图片说明

但是 Chrome 开发人员工具中的应用程序视图显示的 cookie 与以前完全相同。

此外,我浏览了开发人员工具网络视图中的每个条目。任何条目都没有Cookie选项卡。

这非常令人沮丧,因为我不知道您被阻止的 cookie 是否与我们应用程序的运行相关。

有没有办法找出哪个cookie被阻止了?Chrome 不能在写入控制台的警告中提及 cookie 吗?

cookies google-chrome-devtools auth0 samesite

3
推荐指数
1
解决办法
2609
查看次数

为什么没有哈希的SVG片段标识符不起作用?

SVG片段标识符用于链接到SVG文档的特定视图。它们在SVG规范1.1的Secion 17.3.2中定义

通常,它们的格式为MyDrawing.svg#MyView,其中哈希后面的部分指定链接文档中元素的ID。但以我的理解MyDrawing.svg,也应该允许不带哈希的片段标识符。

规格说明如下:
“如果未提供SVG片段标识符(例如,指定的IRI不包含“#”字符,例如MyDrawing.svg),则使用该视图建立SVG文档的初始视图svg最外层元素上的规范属性(例如'viewBox'等)。”

测试用例

如果已通过链接到两个SVG文件的HTML文件对此进行了小型测试。第一个文件是使用片段标识符的链接img1.svg#id1,第二个文件是与标识符的链接,img2.svg 以下是这些文件:

index.html

    <!DOCTYPE html>
    <html lang="en">
        <head>
            <meta charset="UTF-8">
            <title>Fragment Identifier Test</title>
        </head>
        <body>
            <h2>With Hash</h2>
            <div>
                <svg style="width: 128px; height: 128px;">
                    <use xlink:href="img1.svg#id1"></use>
                </svg>
            </div>
            <h2>Without Hash</h2>
            <div>
                <svg style="width: 128px; height: 128px;">
                    <use xlink:href="img2.svg"></use>
                </svg>
            </div>
        </body>
    </html>
Run Code Online (Sandbox Code Playgroud)

img1.svg(svg元素具有ID)

    <svg id="id1" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0,0,512,512">
        <circle cx="256" cy="256" r="200" fill="green" />
    </svg>
Run Code Online (Sandbox Code Playgroud)

img2.svg(svg元素没有ID)

    <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0,0,512,512">
        <circle cx="256" cy="256" r="200" …
Run Code Online (Sandbox Code Playgroud)

svg

2
推荐指数
1
解决办法
370
查看次数

更改img src SVG颜色

在这里,我试图更改图像的svg颜色。

  <button>
 <img src="someImage.svg">
 </button>
Run Code Online (Sandbox Code Playgroud)

是否可以在角度5中更改按钮中svg图像的颜色

css svg image

2
推荐指数
1
解决办法
3129
查看次数

为什么 WebStorm 期望我的 manifest.json 文件与 SAP Fiori 相关?

我正在使用 WebStorm 来编写 Chrome 插件。这需要一个manifest.json文件。

由于某种原因,WebStorm 认为清单文件属于 SAP Fiori 项目并向我发出警告。它告诉我像sap.app和 一样的属性sap.ui丢失了。

在此输入图像描述

我从未参与过 SAP 项目,也从未安装过任何 SAP 相关插件。

为什么默认启用 SAP 支持以及如何在 WebStorm 环境中禁用 SAP 支持?

webstorm sapui5

2
推荐指数
1
解决办法
452
查看次数