Приветствую Вас Прохожий | RSS Воскресенье, 04.12.2016, 21:18
Меню сайта
ВИДЕО УРОКИ СКРИПТЫ UCOZ ШАБЛОНЫ UCOZ ФОТОШОП UCOZ КАТАЛОГ СТАТЕЙ ВЕБМАСТЕРУ UCOZ ВИДЕО ФОТОШОПА ДОПОЛНЕНИЕ САЙТА РАЗДЕЛ СТУДИИ УСЛУГИ НАШЕГО САЙТА


Мини-чат
Все вопросы задаем в форуме,
здесь они игнорируются!



Статистика
Онлайн всего: 15
Гостей: 14
Пользователей: 1
LESIYI



Главная » Файлы » Скрипты для uCoz » Скрипты Разное

Красивый хинт на CSS3 без использования графики

Красивый хинт на CSS3 без использования графики Красивый, хинт, CSS3, использования, графики

Все всегда стремятся сделать свои саит уникальным и красивым в функциях, функция должна быть легкой и не нагружать страницы вашего модуля, для это есть масса стильных штучек одну из которых я вам распишу ниже как установить и настроить под дизайн своего ресурса.
Предлагаю вашему вниманию новый тип оформления ссылок, то как выглядит это можно увидеть на живом примере тут Наведите курсором на ссылкуНаведите курсором на ссылку
Подсказка для uCozOn.ru
вставляем текст


Интересное оформление придаст ссылкам полное описание их, для поисковиков не известно как поведет свое описание но спойлером ссылки назвать не возможно данный вид.
В настройках вид очень прост так как все настройки в самом style

Установка

Как должна выглядеть сама ссылка при наведение на которую будет вылазить окно
Что бы хинт появлялся в ссылки титры используют не совсем стандартный вариант, как правила все хинты построены на теге alt или title в нашем случае этот тип не используется так как необходимо накладывать несколько стилей для вывода класса стиля используется в ссылке class="cursorhelp blue-cursorhelp" где cursorhelp - это окно blue-cursorhelp - это цветность окна
Code

<a href="http://ucozon.ru/dir/11-1-0-4648" class="cursorhelp blue-cursorhelp">Наведите курсором на ссылку<span>Наведите курсором на ссылку<br>Подсказка для uCozOn.ru<br>вставляем текст</span></a>

Тепеть для этой ссылки выбирайте цвет стиля и вставляйте его в таблицу стилей что бы он смог охватить весь сайт, есть где бы вы не оформили подобным методом линк на него будет выводить класс оформления

Установка стиля для вывода хинта:
Вставляем в таблицу стилей CSS нашего сайта сам стиль CSS3 предварительно выбрав цвет его из ниже указанных
Серый цвет подсказки хинта




Зеленый цвет подсказки хинта




Красный цвет подсказки хинта




Желтый цвет подсказки хинта




Синий цвет подсказки хинта




Вся настройка цвета окошка происходит во вторичном стиле к примеру как в последнем стиле светло синем
вот я расписал настройку в 4 цвета
1 Цвет бордюра
2 Цвет фона
3 Цвет бордюра уголка стрелки
4 Цвет бордюра верха тени
Code
/* Color bluue*/

.blue-cursorhelp span  
{
  border-color: #59add4; /*Цвет бордюра*/
  background-color: #61bde7; /*Цвет фона*/
}

.blue-cursorhelp span:after
{  
  border-top-color: #61bde7; /*Цвет бордюра уголка стрелки*/
}

.blue-cursorhelp span:before
{
  border-top-color: #59add4; /*Цвет бордюра верха тени*/
}
Автор\Источник: ucozon.ru

Для того что бы скачать архив необходимо зайти на сайт как пользователь.
Просмотров: 3077 | Комментарии: 7 | Рейтинг: 5.0/6 | |Категория: Скрипты Разное | Добавил: mdbaner | Дата: 29.05.2011 | Скачали: 0 | Теги: Хинт, CSS3, использования, графики, красивый
Похожие новости на нашем сайте
Коментарий к новости

Всего комментариев: 7
6 VisDIZ   Дата: 30.05.2011  Время: 13:26   [№ 8632]
Спасибо.
Кстати я видел похожий токо тама скрипт при навеление на слово вылазиет картинка и на ней надпись.=)

7 STAFF   Дата: 30.05.2011  Время: 13:49   1 [№ 8633]
Тут же написано! Без использования графики!

4 webo4ka   Дата: 29.05.2011  Время: 23:52   [№ 8627]

5 mdbaner   Дата: 30.05.2011  Время: 00:15   1 [№ 8628]
а вот и не угадал, ищи лучше, больше иностранных сайтов просматривай.Только там 1 версия.

3 gutty   Дата: 29.05.2011  Время: 17:58   [№ 8619]
Спасибо

2 smart4on   Дата: 29.05.2011  Время: 16:26   [№ 8617]
Я тож. спасибо хорошая тема.

1 makcim19997   Дата: 29.05.2011  Время: 16:19   [№ 8616]
щас что нибудь подберу для себя, спасибо)


Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]

Форма входа
Логин:
Пароль:


Поиск


На форуме

1 Файловик. Уникальные те...

0

2 Куплю сайты в индексе Я...

1

3 Куплю сайты с ТИЦ/PR (п...

9

4 Предлагаю услуги для ан...

0

5 Предлагаю услуги по про...

0

6 Комплексный прогон сайт...

51

7 Сайт онлайн фильмов на ...

1

8 Проблема с таблицей

9

9 Отредактировать фото

2

10 Уже все перепробовал )

1


Подробней о форуме


Комментарии



Copyright UcozOn.ru™ © 2008-2016


Кнопка 88х31 сайта ucozon.ru