Comments 32
Разработчики библиотеки напоминают, что CSS3 transitions для псевдоэлементов работают пока только в браузере Firefox, но в скором времени будут доступны и в webkit.
Похоже они уже доступны…
Судя по трекеру — да, но проверяю в своих Chrome и Safari (на всякий случай обновил до последних версий) и CSS3 transitions не видно. В Firefox всё работает.
В Chrome точно работает (как минимум под win версией) — как тултипы тут, так и пример transitions'ов тут. Вероятно вы просто ещё не обновились по какой-то причине. Насчёт Safari же ничего не скажу…
Да не за что :)
А в целом — простовато, но достаточно недурно, если вам не нужны лишние навороты.
Transitions для псевдо-элементов не работают в стабильной версии Chrome, только в 26.
Версия Chrome:
s2.hostingkartinok.com/uploads/images/2013/02/c19c4ee991aa05f7f7f2db0bf1652b02.png

Скрины из примеров, которые приводил выше:
s2.hostingkartinok.com/uploads/images/2013/02/1a4667c33c21807d0affea51ae3ae5ee.png
s2.hostingkartinok.com/uploads/images/2013/02/b73ffcae1d97e8807f82ed738a663fc9.png

Проверил также на маке и паре других виндовых машин — всё работает.
Никаких подписок на бета-версии Chrome, бета-фичи или что-то подобное вроде как нет.

Работает всё 1 в 1 как в последней версии FF.
1. Скрины статичны, а transition отвечает за «плавность перехода», задавая время совершения перехода, временную функцию и свойство CSS (либо all по умолчанию). Проще говоря, тултипы должны не просто появляться, а делать это плавно. Если вы знаете, что делает transition, то я извиняюсь, но вы показывате работу анимации с помощью статичных изображений, а это может говорить о том, что не знаете.
2. Пример с сайта W3 Schools тут не при чем, transition не работает в Chrome для псевдо-элементов (в случае hint.css это ::after и ::before), а на W3 Schools transition применяется для обычного элемента.
С примерном с W3 Schools я действительно ошибся, признаю — поспешил взять первое найденное. Насчёт изображений — согласен, не лучший пример — на них толком не видно ничего, но, честно говоря, никакого смысла снимать видео ради доказательства наличия плавной анимации я не вижу.

И, как я уже писал выше — на сайте с примерами тултипов они одинаково плавно появляются как в FF, так и в моём «устаревшем» Chrome. Соответственно имеет смысл полагать, что transition таки работает на этой версии по каким-то причинам.
Разработчики библиотеки напоминают, что CSS3 transitions для псевдоэлементов работают пока только в браузере Firefox, но в скором времени будут доступны и в webkit.

CSS3 transitions для псевдоэлементов уже доступны в webkit-браузерах


А также в IE10
UFO landed and left these words here
UFO landed and left these words here
Библиотека разработана не мной. Про технологию вкратце рассказано в самом начале топика в разделе «Что».
Ума не приложу, с какой целью кому-нибудь понадобится копировать подсказку. Это всего-лишь подсказка, как title="".
UFO landed and left these words here
Такая продвинутая бабушка сможет и скриншот связать :) А вообще, вы себе это представляете?
смущает вот это
.hint--left::after { margin-bottom: -14px; }

это значит тултипы работают для определенного размера шрифта, и только одна строка. плюс нельзя html пихать в него.
UFO landed and left these words here
UFO landed and left these words here
Задержку наверное можно похакать через cubic-bezier.
Или не хакать, а решить нормально с помощью transition-delay. Или я чего-то не понял?
UFO landed and left these words here
Надо всегда писать поддерживаемые браузеры.
IE9 — работает, IE8 — нет.
UFO landed and left these words here
UFO landed and left these words here
Only those users with full accounts are able to leave comments. Log in, please.