Подтвердить что ты не робот

Определить, включена ли загрузка шрифтов в IE

Есть ли способ определить, отключено или включено ли свойство загрузки шрифтов в Internet Explorer?

В настоящее время, если я должен был реализовать решение @font-face (font-squirrel или typekit или другое) для рендеринга шрифтов, все браузеры будут играть хорошо, если только Internet Explorer не имеет опции "Загрузка шрифта".

Этот параметр можно найти в IE > Свойства обозревателя > Безопасность > Пользовательский уровень > Загрузкa > Загрузка шрифтов > Включить/отключить.

Если я могу обнаружить этот параметр, я могу вернуться к методам javascript.

Эти решения не работают, поскольку этот параметр фактически не отключает эту функцию, что предотвращает загрузку:

  • http://paulirish.com/2009/font-face-feature-detection/
  • http://www.lalit.org/lab/javascript-css-font-detect/

EDIT: Я должен упомянуть, что мы не можем использовать серверное решение, оно должно быть чисто клиентским сценарием.

4b9b3361

Ответ 1

Поскольку эта функция предотвращает загрузку, решение (довольно грязное) должно было бы попросить IE загрузить так называемый шрифт, который на самом деле является простым script на вашем сервере, который помещает, например. cookie, говорящий "хорошо, что он выбрал шрифт" и возвращает пустую страницу. Когда пользователь загружает следующую страницу, вы разворачиваете механизм Javascript, если cookie не существует.

enter image description here

Ответ 2

Основываясь на блок-схеме @Zopieux, я смог сделать эту работу script для IE6-9, когда загрузка шрифтов отключена, что в моем случае было для клиента, где, как и другие корпоративные интрасети, этот параметр отключен.

CSS

@font-face {  
    font-family: 'TestFont';  
    src: url('/includes/font.php?type=eot');  
    src: url('/includes/font.php?type=eot#iefix') format('embedded-opentype'),  
     url('/includes/font.php?type=woff') format('woff'),
     url('/includes/font.php?type=ttf') format('truetype'),
     url('/includes/font.php?type=svg#UniversLTStd49LtUltraCn') format('svg');
    font-weight: normal;  
    font-style: normal;  
}  

PHP, когда запрашивается URL-адрес src-шрифта font-face, он вытаскивает этот script, который проверяет тип, устанавливает cookie и обслуживает веб-выбор. Если загрузка шрифтов включена и вы не перенаправляете файл шрифта, IE будет вызывать ошибку @font-face:

<?php
$type = $_REQUEST['type'];
$location = "Location: /includes/fonts/universltstd-lightultracn-webfont.".$type;

// create a cookie
setrawcookie("FontDownloaded", 1, time()+3600*24, '/');
header($location);

?>

JS, затем на стороне клиента, сделайте что-нибудь подобное, чтобы проверить файл cookie, и выполните альтернативу, например cufon-yui.js или typeface.js:

$(function() {
    $('body').append('<span id="TestFont"/>');
    $('#TestFont').html('Testing').css({
        fontFamily: 'TestFont',
        opacity: 0
    });

    // find cookie
    bool = Boolean(getCookie('FontDownloaded')); // use your own cookie method

    if (!bool) {
        // implement @font-face fallback        
        Cufon.replace('.items', { fontFamily: 'NewFont' });
    }
    $('#TestFont').remove();
});

Ответ 3

Я понимаю, что этот вопрос старый, но эта проблема все еще существует для некоторых корпоративных пользователей Интернета со строгой ИТ-безопасностью. Я рассмотрел решения выше и другие, но они не сработали для меня, поэтому я нашел другое решение, которое не требует кода на стороне сервера, ни javascript, ни css. Его по существу волшебство, но оно имеет некоторые ограничения.

Ограничение 1: Это будет работать только для значков, которые используют кодовые точки большого числа для отображения изображений. Это не будет работать для шрифтов шрифта для читаемого текста.

Ограничение 2: вы должны найти стандартный символ UTF-8, который является подходящей заменой для вашего пользовательского значка.

Например, если у вас есть собственный шрифт, который вы используете для отображения символа звезды, подходящим резервом для этого будет unicode code point 0x2605 ★. Таким образом, в коде генерации шрифтов вам понадобится жестко кодировать этот код для вашего класса css для вашего значка звезды. Если вы использовали "grunt-webfont", вы бы сделали что-то подобное в своем файле grunt:

webfont: {
    icons: {
        options: {
           codepoints: {
              'star': 0x2605
       ...
}}}}

Звезда - прекрасный пример; может возникнуть сложность найти подходящую замену UTF8 для ваших фантазийных значков, поэтому это может не сработать для всех. Учитывая, что эта проблема затрагивает очень небольшое число пользователей, мы считаем, что это было подходящее прозрачное решение, которое не влияло на обычных пользователей с помощью дополнительного js/css/cookie cruft.