【问题标题】:video-js custom font not working in Firefoxvideo-js 自定义字体在 Firefox 中不起作用
【发布时间】:2013-08-09 13:56:40
【问题描述】:

用 Firefox 看看这里(我有 22.0):

http://www.jamhouse.com.au/

您会看到 video-js 自定义字体不起作用。在 Chrome 中运行良好。

任何想法将不胜感激!

瓦托:)

【问题讨论】:

    标签: firefox video.js custom-font


    【解决方案1】:

    Firefox 具有极其严格的跨域策略。这包括您网站的子域(甚至 www)。

    在您的 css 中,您使用 http://jamhouse.com.au/templates/gk_fest/js/html5/font/vjs.XYZ 引用字体(注意没有 www.),而在您发布的链接上,它是 http://www.jamhouse.com.au 如果您转到 http://jamhouse.com.au,您的字体就可以工作。

    您有几个选择:

    推荐用于真正的跨域

    在您的 .htaccess 或 httpd.con 中设置 Access-Control-Allow-Origin

    对于 Apache:http://davidwalsh.name/cdn-fonts

    对于 IIS:http://deserialized.com/iis/serving-web-fonts-cross-domain-with-iis/

    -- 或--

    为您的案例推荐

    您可以使用 url(font/vjs.XYZ)... 相对引用字体...因为这将使用您所在的任何域/子域(www 或非 www)

    -- 或--

    您可以强制执行http://www.jamhouse.com.auhttp://jamhouse.com.au,并以您选择的任何方式引用字体。

    对于 Apache:http://www.thesitewizard.com/apache/redirect-domain-www-subdomain.shtml

    对于 IIS:http://forums.iis.net/t/1154053.aspx/1

    -- 或--

    您可以将字体直接嵌入到 css 中(我选择了我的 video.js 安装)

    在 css 中嵌入字体 - http://blog.patdavid.net/2012/08/embedding-fonts-with-css-and-base64.html

    在专家模式下,您可以选择 base64 编码。 http://www.fontsquirrel.com/tools/webfont-generator(我的编码成功有限,播放三角形(\e001)没有出现。)

    在base64 http://www.motobit.com/util/base64-decoder-encoder.asp中编码文件(确保输出全部在一行上

    【讨论】:

      【解决方案2】:

      过去 2 小时我已经解决了您的问题哈哈。好的,我已经设法让它工作了。问题出在你的http://jamhouse.com.au/templates/gk_fest/js/html5/video-js.css

      您通过完整路径 url 链接到字体,但必须有某种安全措施,只有 Chrome 允许这样做。如果您使用字体的相对 url,它们将出现。我刚刚通过在本地保存您的页面并更改 css 中的字体链接来尝试这个,现在它可以工作了。试试看吧。

      【讨论】:

        猜你喜欢
        • 2014-07-22
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2012-04-22
        相关资源
        最近更新 更多