• Страница 1 из 1
  • 1
Форум » Веб-разработка » HTML + CSS — коды » Скрипт новый вид всплывающей подсказки Title для uCoz
Скрипт новый вид всплывающей подсказки Title для uCoz
Delete
Среда, 26 Сентября 2012 | Сообщение 1
Оффлайн
Проверенные
Сообщений:1079
Награды: 7
Вашему вниманию, новый вид всплывающей подсказки, что работает на Title для сайта uCoz. Что теперь вы при наведение будите видеть подсказку, которая появится на прозрачном темном фоне, что для светлого сайта отличное приложение. Также будет идти вид, как стрелка, где она прописано, а те просто где то в стороне. Ставят основном на ключевые слова, что работает от операторов, где аналогично показывает.

Особенности:

- Небольшой вес, всего 8 килобайт
- Перемещается вслед за мышкой (Для некоторых это минус или а для других - наоборот плюс)
- Работает почти во всех новых браузерах
- Простая установка



Установка:

1) Устанавливаем в верхнюю часть сайта в самый верх следующий скрипт:

Для начало нам следует установить основной js, который будет отвечать за подсказку, для этого в низ страницы перед закрывающим тегом установим следующей js:

JS

Код
<script type="text/javascript" src="http://zornet.ru/Aben/ABGDA/zornet_ru/unitip.js"></script>


Если у вас нету "Верхней части сайта", то ставим скрипт перед тега

Код
</body>


На страницы где хотите видеть подсказку (например "Архив новостей")

2) Теперь чтобы наш title отображался у нужного нам элемента, например нужной ссылки, следует прописать ей class="tip"

Вот пример:

Код
<a class="tip" title="ZorNet.Ru" href="http://zornet.ru/" >ZorNet.Ru</a>


3) Осталось прописать css стили для title - заходим в Таблицу стилей(CSS) и вставляем:

Код
/* unitip css */   
#unitip {   
position: absolute;   
z-index: 1000;   
top: -1000px;   
color: #fff;   
font:11px Verdana,Arial,Helvetica, sans-serif; color:#CED9E8;   
display: none;   
}   
#unitippoint, #unitipmid, #unitipcap {   
position: relative;   
top: 0px;   
left: 0px;   
width: 145px;   
display: block;   
}   
#unitippoint {   
background: url('http://zornet.ru/Aben/ABGDA/zornet_ru/TipPoint.png') no-repeat;   
height: 19px;   
overflow: hidden;   
}   
#unitipmid {   
background: url('http://zornet.ru/Aben/ABGDA/zornet_ru/TipMid.png') repeat;   
width: 115px;   
height: auto;   
padding: 5px 15px;   
}   
#unitipcap {   
background: url('http://ucoz-helper.ucoz.com/js_jquery/TipCap.png') no-repeat;   
height: 7px;   
overflow: hidden;   
}


Всё наша подсказка теперь будет отображаться как и положено.

PS - архив прикреплен к материалу.
Прикрепления: 7236077.jpg (7.6 Kb) · Title_dla_uCoz.rar (5.7 Kb)


На случай если буду нужен, то я там же, где и был, когда был не нужен...
Страна: (RU)
-SAM-
Среда, 08 Ноября 2017 | Сообщение 2
Оффлайн
Друзья сайта
Сообщений:880
Награды: 40
Источник материала: center-dm.ru (не спам). В своё время также использовалось в меню сайта Diz-CS, вот выложено, но там порипали лишнего были, что всю таблицу стилей прописали (при этом ссылки на графику не выпрямив, как и файлы в прикрепления не залили - тем самым на нет свели всё), посему оригинал берём с первоисточника (не реклама).



Помог? Скажи спасибо в виде "+" - вам мелочь, а мне приятно.
Бесплатное оказание помощи в ответах на "Вопросы про uCoz".
Страна: (UA)
Kosten
Среда, 08 Ноября 2017 | Сообщение 3
Оффлайн
Администраторы
Сообщений:44269
Награды: 70
Скрипт не рабочий, здесь, так как ссылка битая и на источнике.
Страна: (RU)
Kosten
Среда, 08 Ноября 2017 | Сообщение 4
Оффлайн
Администраторы
Сообщений:44269
Награды: 70
Цитата -SAM- ()
В своё время также использовалось в меню сайта Diz-CS

-SAM-, а причем здесь меню?
Страна: (RU)
-SAM-
Четверг, 09 Ноября 2017 | Сообщение 5
Оффлайн
Друзья сайта
Сообщений:880
Награды: 40
Kosten, уже всё в личке написал, как и дал ссылку на меню, где это всё прописано - как будет время, то просто залейте файлы сюда всё, а посты отсюда из темы - удалите.



Помог? Скажи спасибо в виде "+" - вам мелочь, а мне приятно.
Бесплатное оказание помощи в ответах на "Вопросы про uCoz".
Страна: (UA)
Kosten
Среда, 22 Ноября 2017 | Сообщение 6
Оффлайн
Администраторы
Сообщений:44269
Награды: 70
Материал поменял на рабочие ссылки.
Страна: (RU)
Форум » Веб-разработка » HTML + CSS — коды » Скрипт новый вид всплывающей подсказки Title для uCoz
  • Страница 1 из 1
  • 1
Поиск: