css - 任何 Javascript 错误期间,Font Awesome 图标都会中断

标签 css google-chrome font-awesome font-awesome-5

为什么每当页面上出现 Javascript 错误时,Font Awesome 图标都会显示为闪烁的问号?

正确的 Font Awesome 图标正确闪烁 1 秒然后变为 ?

您可以在此页面上看到一些损坏的图标以供引用。另外值得注意的是,这是一个带有插件的 Shopify 网站,有时可能会出现错误,因此很难让这样的网站 100% 控制台无错误。我在 Font Awesome 4 和 Font Awesome 5 上都遇到过这个问题:

https://outdoor.best

在 Chrome 版本 65.0.3325.181 上测试 麦克高塞拉利昂

enter image description here

编辑:我很傻,使用 CDN 免费调用 Font Awesome 5 Pro 和 Font Awesome 5 Pro。我删除了免费版本,现在可以使用了。我会删除这个问题,但不想受到 Stack Overflow 工作人员的惩罚!

最佳答案

那是因为一些图标从 v4 变成了 v5。例如,在您提到的那个页面中,“登录”图标,您可以在源代码中看到它被标记为 fa fa-sign-in 并且在 Font Awesome Website 中它说它已更改为 fas fa-sign-in-alt,并且它说:

This icon replaces Font Awesome 4's fa-sign-in We created a shim to help folks upgrade easily their existing projects from Font Awesome 4 to 5 and avoid those embarrassing missing icon moments.

关于css - 任何 Javascript 错误期间,Font Awesome 图标都会中断,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50072780/

相关文章:

CSS:overflow-y 和 padding 调整

html - 向现有 CSS 菜单添加更多级别

css - 为什么 Chrome 在转换媒体查询和 float 元素时表现不同?

javascript - 为什么我的 Windows 机器上的 chrome 限制脚本中的频率箱数量?

html - 将 Font Awesome 图标添加到 css 类

jquery - css & angular - 使用灰度动态加载背景图像

iphone - 固定位置在 iPhone 中不起作用

google-chrome - Chrome 不尊重主机文件条目

html - CSS :before pseudo element displays one but not both on separate elements

html - 在哪里可以找到 Bootstrap 和 Font Awesome 最新的 CDN 链接?