Всплывающие подсказки

@Gerd199 · Регистрация: 06.03.2014

Студворк — интернет-сервис помощи студентам

Возможно сделать привязку по атрибуту?

CSS

.tooltip:hover:after{
    background: #333;
    background: rgba(0,0,0,.8);
    border-radius: 5px;
    bottom: 26px;
    color: #fff;
    content: attr(title);
    left: 20%;
    padding: 5px 15px;
    position: absolute;
    z-index: 98;
    width: 220px;
}

Дабы каждый раз не прописывать класс

@Fourd · 01.01.2018, 10:09

можно, просто добавьте атрибут в элемент, в вашем случае это title

HTML5

1	<div class="tooltip" title="my tooltip">Lorem ipsum dolor sit.</div>

@Htext · 01.01.2018, 14:26

Сообщение от Gerd199

:hover:after

Быть может, это и будет работать. НО: разве что, в новых браузерах. У меня в FF24, скажем, не работает.
Если хотите сделать пользовательскую всплывающую подсказку (если не хватает стандартного title) тут лучше использовать технологию всплывающего меню.

Добавлено через 1 минуту
Правда, это - дополнительная разметка. Ну, или добавить дополнительный блок средствами JS.

@Fourd · 01.01.2018, 18:42

Htext, в ff24 все прекрасно работает
и даже больше скажу, если верить сети, то поддержка данной спецификации ведется с самый ранних версий ff, исключением является ie, где была внедрена частичная поддержка лишь в 8 версии, хотя даже там она работает прекрасно

@Mailo · 07.01.2018, 04:35

Через динамичные псевдоклассы такие вещи возможно и надо делать, но только в том случае, если в них не требуется интерактивность.

@Htext 356 / 117 / 20 Регистрация: 08.01.2015 Сообщений: 1,352 Записей в блоге: 1
	01.01.2018, 14:26	3
	Сообщение от Gerd199 :hover:after Быть может, это и будет работать. НО: разве что, в новых браузерах. У меня в FF24, скажем, не работает. Если хотите сделать пользовательскую всплывающую подсказку (если не хватает стандартного title) тут лучше использовать технологию всплывающего меню. Добавлено через 1 минуту Правда, это - дополнительная разметка. Ну, или добавить дополнительный блок средствами JS. 0

@Fourd 98 / 98 / 46 Регистрация: 21.03.2012 Сообщений: 378
	01.01.2018, 18:42	4
	Htext, в ff24 все прекрасно работает и даже больше скажу, если верить сети, то поддержка данной спецификации ведется с самый ранних версий ff, исключением является ie, где была внедрена частичная поддержка лишь в 8 версии, хотя даже там она работает прекрасно Миниатюры 0

@Mailo 228 / 208 / 27 Регистрация: 18.02.2010 Сообщений: 1,991
	07.01.2018, 04:35	5
	Через динамичные псевдоклассы такие вещи возможно и надо делать, но только в том случае, если в них не требуется интерактивность. 0

Опции темы