DirectoryWeb
    • Каталог
      • Скрипты
      • Боты
      • Программы
      • Android, iOS приложения
    • Арбитраж трафика
      • Тизерные сети
      • SMS рассылки
      • Telegram Ads
      • Анализ трафика
      • Видео трафик
      • Автоматизация
      • CPA-сети
      • Push-реклама
      • Popunder реклама
      • Нативная реклама
      • Ретаргетинг
      • Кейсы
      • Трекеры
      • Партнёрские программы
        • Товарные партнерки
        • Финансовые партнерки
        • Партнерки интернет-магазинов
        • Зарубежные партнерки
      • Реклама в Telegram
      • Сервисы
        • Прокси
        • Виртуальные карты
      • Инструменты
        • Мультиаккаунтинг
      • Обзоры
      • Мануалы
      • Антидетект-браузеры
    • Статьи
      • Маркетплейсы
      • Безопасность в сети
      • Заработок в интернете
      • Сайтостроение
      • Оптимизация сайтов
      • Обучение
      • Криптовалюты
      • Новости
      • Разное
      • Новости сайта
  • Контакты
  • Telegram
  • Вход / Регистрация

купить скрипт казино

Psb.Hosing - Хостинговое решение для быстрой и стабильной работы ваших проектов.
Купить резедентные прокси
Vibix - надеждый видео-балансир
    Заработок в интернете без вложений » Статьи » Сайтостроение » Как сделать всплывающие подсказки на CSS

Отзывы

Vibix Обновление плеера: стало ещё удобнее Представляем долгожданные улучшения в работе плеера: 1....

Как сделать всплывающие подсказки на CSS

Статьи / Сайтостроение

Как сделать всплывающие подсказки на CSS

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


1) Добавим следующий код в начало html файла или же вынести в таблицу каскадных стилей:

a.tt{position:relative;z-index:24;color:#3CA3FF;font-weight:bold;text-decoration:none;}a.tt span{ display: none; } /*background:; ie hack, something must be changed in a for ie to execute it*/    a.tt:hover{ z-index:25; color: #aaaaff; background:;}    a.tt:hover span.tooltip{    display:block;  position:absolute;    top:0px; left:0;    padding: 15px 0 0 0;    width:200px;    color: #993300;    text-align: center;    filter: alpha(opacity:90);    KHTMLOpacity: 0.90;    MozOpacity: 0.90;    opacity: 0.90;    }    a.tt:hover span.top{    display: block;    padding: 30px 8px 0;    background: url(bubble.gif) no-repeat top;    }    a.tt:hover span.middle{ /* different middle bg for stretch */    display: block;    padding: 0 8px;     background: url(bubble_filler.gif) repeat bottom;     }    a.tt:hover span.bottom{    display: block;    padding:3px 8px 10px;    color: #548912;    background: url(bubble.gif) no-repeat bottom;    }  


2) Код, который показывает как вставлять подсказки в страницу.

<a href="#" class="tt">    Тут текст термина (который нуждается в подсказке)    <span class="tooltip">    <span class="top">    </span>    <span class="middle">    Тут текст всплывающей подсказки    </span>    <span class="bottom">    </span>    </span>    </a>


Вот и все! Подсказки готовы исходники можно скачать ниже!

Как сделать всплывающие подсказки на CSS

2-07-2012, 09:38 Неизвестно
.
example.zip " class="btn btn-primary w-100 f90 fw7" target="_blank" rel="nofollow noopener external" itemprop="downloadUrl">
Скачать

Telegram

МАРКЕТПЛЕЙС ЦИФРОВЫХ ТОВАРОВ

Перейти в чат вебмастеров
  • DirectoryWeb
  • 02.07.2012
  • 1 6 381
  • 0
    • 80
    • 1
    • 2
    • 3
    • 4
    • 5
Скрипт сервиса контекстной рекламы TAK.RU
Скрипт сервиса контекстной рекламы TAK.RU
22-01-2017, 20:27, Рекламные сервисы
Rukassa - сервис приема онлайн платежей high риска
Rukassa - сервис приема онлайн платежей high риска
18-09-2024, 14:32, Платёжные системы / Сервисы
Скрипт облачного майнинга биткойнов Bitmine v2.0
Скрипт облачного майнинга биткойнов Bitmine v2.0
14-02-2022, 19:55, Облачные майнинги
Скрипт денежных переводов онлайн Remito v3.1
Скрипт денежных переводов онлайн Remito v3.1
22-09-2021, 13:31, Платёжные системы
Шаблон CompST для ShopCMS
Шаблон CompST для ShopCMS
17-06-2014, 00:42, HTML шаблоны
Скрипт инвестиционного проекта №22 для GoldCoders
Скрипт инвестиционного проекта №22 для GoldCoders
3-11-2024, 15:21, Скрипты / Финансы / HYIP, MLM, МММ

Твой комментарий..

  • Скрипты
    • Telegram
    • Финансы
    • CS:GO
    • Бонусники
    • Браузерные игры
    • Интернет магазины
    • Автопостинг
    • Доски объявлений
    • Обменники
    • Казино
    • Каталоги
    • Конструкторы сайтов
    • Облачные майнинги
    • Платёжные системы
    • Рекламные сервисы
    • Социальные сети
      • TikTok Ads
    • Экономические игры
    • Чаты
    • Хостинги
    • HYIP, MLM, МММ
    • Фриланс биржи
    • E-mail рассылки
    • Разное
  • Арбитраж трафика
    • Тизерные сети
    • SMS рассылки
    • Telegram Ads
    • Анализ трафика
    • Видео трафик
    • Автоматизация
    • CPA-сети
    • Push-реклама
    • Popunder реклама
    • Нативная реклама
    • Ретаргетинг
    • Кейсы
    • Трекеры
    • Партнёрские программы
      • Товарные партнерки
      • Финансовые партнерки
      • Партнерки интернет-магазинов
      • Зарубежные партнерки
    • Реклама в Telegram
    • Сервисы
      • Прокси
      • Виртуальные карты
    • Инструменты
      • Мультиаккаунтинг
    • Обзоры
    • Мануалы
    • Антидетект-браузеры
  • HTML шаблоны
  • Боты
  • Программы
    • Парсинг
  • Android, iOS приложения
  • Статьи
    • Маркетплейсы
    • Безопасность в сети
    • Заработок в интернете
    • Сайтостроение
    • Оптимизация сайтов
    • Обучение
    • Криптовалюты
    • Новости
    • Разное
    • Новости сайта
Обзор антидетект-браузера Undetectable: функционал и особенности
Подробнее
Обзор антидетект-браузера Undetectable: функционал и особенности
Telegram Soft — многоцелевой комбайн для работы с Telegram
Подробнее
Telegram Soft — многоцелевой комбайн для работы с Telegram
AlterCPA Pro: универсальная платформа для CPA
Подробнее
AlterCPA Pro: универсальная платформа для CPA
PrSkill
Подробнее
PrSkill
Партнерская сеть MyLead
Подробнее
Партнерская сеть MyLead
Скрипт управления проектами Grow CRM v2.1
Подробнее
Скрипт управления проектами Grow CRM v2.1
Скрипт биткоин крана FaucetCMS
Подробнее
Скрипт биткоин крана FaucetCMS
Скрипт анализа и рейтинга сайтов ProRank v1.0.3
Подробнее
Скрипт анализа и рейтинга сайтов ProRank v1.0.3
Скрипт Payeer бонусника BONUSAVSEM
Подробнее
Скрипт Payeer бонусника BONUSAVSEM
Cкрипт игры с выводом денег FixNova
Подробнее
Cкрипт игры с выводом денег FixNova
Loading...

Внимание! Данный материал предоставлен сайтом DirectoryWeb.ru исключительно в ознакомительных целях. Администрация не несет ответственности за его содержимое

  • Топ просмотров
  • Высший рейтинг
  • Самый топ
Скрипт сайта рулетки CSGOSHIK

Скрипт сайта рулетки CSGOSHIK

  • DirectoryWeb
  • 01.10.2018
  • 1 3 910
  • 0
    • 60
    • 1
    • 2
    • 3
    • 4
    • 5
  • Подробнее..
Скрипт онлайн казино Фараон

Скрипт онлайн казино Фараон

  • DirectoryWeb
  • 30.09.2018
  • 1 7 958
  • 0
    • 60
    • 1
    • 2
    • 3
    • 4
    • 5
  • Подробнее..
Скрипт онлайн казино FlashCasino 1.2

Скрипт онлайн казино FlashCasino 1.2

  • DirectoryWeb
  • 26.10.2018
  • 1 3 469
  • 0
    • 60
    • 1
    • 2
    • 3
    • 4
    • 5
  • Подробнее..
Cкрипт онлайн лотереи Lottery for life

Cкрипт онлайн лотереи Lottery for life

  • DirectoryWeb
  • 17.10.2018
  • 1 4 279
  • 0
    • 60
    • 1
    • 2
    • 3
    • 4
    • 5
  • Подробнее..
Скрипт онлайн казино Вулкан NEW

Скрипт онлайн казино Вулкан NEW

  • DirectoryWeb
  • 28.10.2018
  • 1 12 491
  • 0
    • 60
    • 1
    • 2
    • 3
    • 4
    • 5
  • Подробнее..
Скрипт Bitcoin игр онлайн Quizda

Скрипт Bitcoin игр онлайн Quizda

  • DirectoryWeb
  • 01.08.2018
  • 1 4 215
  • 0
    • 60
    • 1
    • 2
    • 3
    • 4
    • 5
  • Подробнее..
Скрипт игры моментальной лотереи - рулетки Best-Loto

Скрипт игры моментальной лотереи - рулетки Best-Loto

  • DirectoryWeb
  • 23.01.2018
  • 1 8 471
  • 0
    • 60
    • 1
    • 2
    • 3
    • 4
    • 5
  • Подробнее..
Скрипт моментальной лотереи Fast Loto

Скрипт моментальной лотереи Fast Loto

  • DirectoryWeb
  • 05.10.2017
  • 1 7 951
  • 0
    • 60
    • 1
    • 2
    • 3
    • 4
    • 5
  • Подробнее..
Скрипт онлайн казино Brilliant-Club

Скрипт онлайн казино Brilliant-Club

  • DirectoryWeb
  • 02.07.2017
  • 1 10 224
  • 0
    • 60
    • 1
    • 2
    • 3
    • 4
    • 5
  • Подробнее..
Информация
  • О проекте
  • Правила
  • Статистика
  • Облако тегов
  • Контакты
  • Карта сайта
Каталог
  • Скрипты
  • Боты
  • Программы
  • Android, iOS приложения
  • Статьи
Арбитраж трафика
  • Кейсы
  • Партнёрские программы
  • Сервисы
  • Инструменты
  • Обзоры
Полезные ссылки
  • Партнерские программы и сервисы
  • Скрипты, моды и шаблоны
Заказ
Быстрый вход

Используйте социальные сети для быстрой регистрации и авторизации.

ВКонтакте
Создать аккаунт / Регистрация
Авторизация

Я забыл свой пароль