Как избежать ошибки в всплывающей подсказке, необходимой для Opera при использовании @ font-face? - PullRequest
Новая
       18

Как избежать ошибки в всплывающей подсказке, необходимой для Opera при использовании @ font-face?

3 голосов
/ 11 марта 2012

Я считаю, что это ошибка Opera, поэтому позвольте мне сначала показать вам, что не так. Я использую собственный шрифт @ font-face на всем сайте. Работает нормально везде. За исключением необходимой всплывающей подсказки Opera, в которой при использовании нестандартного шрифта не отображается текст.

Вот так выглядит подсказка при использовании @ font-face для всего содержимого сайта:
enter image description here

Вот как это должно выглядеть:
enter image description here

Итак, это мое определение @ font-face: 

@font-face {
    font-family: 'OpenSans';
    src: url('/fonts/OpenSans-Regular-webfont.eot');
    src: url('/fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
        url('/fonts/OpenSans-Regular-webfont.woff') format('woff'),
        url('/fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
        url('/fonts/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

И вот как я установил содержимое всего сайта: 

body, button, input, select, textarea {
    color: #454545;
    font: normal normal 12px/15px "OpenSans", "Lucida Grande", "Trebuchet MS", sans-serif;
}

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

Ответы [ 3 ]

2 голосов
/ 14 марта 2012

Я верю, что Diggersworld прав, говоря, что это проблема Opera. Я часто работаю с Opera и использую jQuerytools (или аналогичный скрипт всплывающей подсказки), чтобы обойти это несоответствие в Opera.

Вы должны иметь возможность использовать настраиваемый html для создания всплывающей подсказки, не жертвуя выбранным шрифтом.

1 голос
/ 11 июня 2012

Да, это известная ошибка Opera.

По большей части Opera наследует стили шрифта от того, что применено к элементу ввода. Например, input{font-size:2em;} также выдаст сообщение об ошибке 2em. Но, как вы обнаружили, при использовании @ font-face есть ошибка.

Единственный способ обойти это - и это не так уж и много - это стилизовать поля формы вместо системного шрифта.

0 голосов
/ 11 июня 2012

Я столкнулся с той же ошибкой.Существует ужасный хак, если вы обслуживаете свои страницы как * .php. Я добавил это в верхней части страницы: 

<?php $u_agent = $_SERVER['HTTP_USER_AGENT']; $opera = false; if(preg_match('/Opera/',$u_agent)){$opera = true;}?>

, а затем внутри формы (служит эхом): 

echo "<input type='text' name='required_field1' title='This field is required.'";if($opera == false){echo "required";}echo" />";

Осталось только иметь запасной вариант для браузеров без понимания 'требуемого' (и оперы) примерно так: 

if($_POST['required_field1'] == NULL && $_POST['required_field2'] == NULL){echo "Please fill out all of the form fields.";}

ALTERNATIVE Мой сервер только что обслуживал значения по умолчанию при использовании get_browser ()-функция, но вы можете попробовать что-то вроде этого в качестве альтернативы вместо всего этого в верхней части страницы: 

$browser = get_browser(null, true);

и вместо "if ($opera == false)" вы наберете: 

if ($browser[browser] != 'Opera')

который был бы немного короче, но не проверен должным образом;)

...