Короткие заметки

Хочу написать пару интересный вещей, на случай если кому-то пригодится.

1) В файрфоксе вкладки можно прикреплять, тогда вкладка будет считаться "App tab", будет всегда прикреплена слева иметь приоритет выполнения скриптов такой же как активная вкладка. (В неактивных вкладках различные анимации и т.п. будут приостанавливаться). Но главную интересную фишку, я нашла недавно. Прикреплённые вкладки, например gmail могут мигать, оповещая пользователя об изменениях на странице. Мигает вкладка в том случае — если у данной страницы меняется title. Это легко проверить следующим кодом:

<script>
    // for firefox glowing pinned tab
    // window.setInterval  (function  (){document.title=Math.random  ();},500);
</script>

2) В случае с <input type="number">, если вы сами хотите оформить стрелочки инпута — движки webkit позволяют их отключать. Используйте вот такой код:

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

Хочу специально заметить что в случае полей ввода для цифр — не желательно использовать input type="text", так как на мобильных устройствах для этих полей будет показываться текстовая клавиатура, вместо числовой.

3) Firefox в 17й версии будет поддерживать крупные иконки сайтов в адресной строке, что не удивительно с появлением ретины. https://wiki.mozilla.org/Improve_display_of_location_bar_results. По ссылке есть макет концепта
 

Пока этого нет в nightly, но надеюсь скоро появится. Так что можете заранее начать переделывать иконки своих сайтов, если хочется =). Будьте первыми. Надеюсь другие браузеры так же будут использовать большие иконки в своём UI.

Замечу что это касается только favicon.ico. Для айпадика например вы можете задавать большие иконки, но для совершенно других целей.

With Apple's formatting (rounded corners, reflective shine)

<link rel="apple-touch-icon" href="somepath/image.png" />

Without reflective shine

<link rel="apple-touch-icon-precomposed" href="somepath/image.png" />

Ещё интересное про иконки:

• http://ru-webdev.livejournal.com/3212027.html
• http://artgorbunov.ru/bb/soviet/20120116/

4) Ни для кого не секрет какой тормозной плагин скайпа к браузерам, который подсвечивает телефоны на странице. Он перехватывает все изменения DOM в поисках номера, чем заметно тормозит скрипты, и портит дизайн страницы. В Firefox этот плагин в чёрном списке (надеюсь что приложила к этому руку). Тем не менее, где-то мелькала новость что плагин на конкретном сайте вебмастер может отключить добавив следующий метатег.: (подробнее тут)

<meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE" />
<meta content="telephone=no" name="format-detection">