Дмитрий Валак
Блог Верстальщика

Tip - Всплывающие подсказки на чистом CSS

Как-то возникла идея создать всплывающие подсказки, так называемые tooltip, на чистом CSS. Я уже видел похожие реализации, но хотелось сделать именно свое. Но идея была не в том, чтобы просто сделать, а сделать качественно, чтобы этими всплывающими подсказками могли пользоваться все разработчики.

Площадка Envato. Довольно хороший контроль качества твоей работы и если у тебя получилось выложить свой продукт к ним на площадку - значит он довольно неплохой. Поэтому целью было сделать всплывающие подсказки на чистом CSS + выложить все это на Envato market в раздел Codecanyon.

И вот буквально за один день я сделал эти самые tooltip'ы, подготовил графику, написал документацию, сделал демо-сайт и записал небольшое видео для демонстрации и все это залил на Codecanyon. Буквально через часов шесть, мою работу проверили, что меня сильно удивило, обычно этот процесс занимает намного больше времени, и отправили мое творенье на доработку. Доработать нужно было только одну вещь. В названии классов я использовал название .tooltip, мне сказали что это широкоиспользуемое слово и лучше придумать что-то другое. Я подумал и решил от tooltip оставить только tip. Поменял везде названия классов и отправил на повторную проверку.

Ожидание повторной проверки длилось почти сутки и этой же ночью Envato одобрили мои tooltip'ы.

Видео:

Посмотреть результат можно здесь: https://codecanyon.net/item/tip-pure-css-tooltips/19347674

Вы можете приобрести скрипт, официально купив его на envato market, всего за 5$ (стоимость 5$ + комиссия платформы 1-2$).

Tip - всплывающие подсказки на чистом CSS это качественные подсказки сделанные на чистом CSS. Информация

  • Никакого javascript
  • 8 позиций подсказок
  • 19 цветов (легко добавить любые цвета)
  • 5 размеров
  • С анимацией
  • Легко использовать и настраивать
  • SASS исходники
  • Gulp автоматизация
  • Документация

Всем хорошего дня!