DLE - красивые всплывающие подсказки через title, скрипт tooltip

DLE - красивые всплывающие подсказки через title, скрипт tooltip


В данной статье расскажу про маленький скриптик, с помощью которого можно настроить всплывающую подсказку на теге title="" без дополнительных тегов и кодов.

По сети гуляет много разных скриптов, но большинство из них, либо не работает, либо требует дополнительных тегов. А мне этого не нужно. Особенность данного скрипта в том, что он показывает тег title без дополнительных тегов!

<a href="{link}"><img src="{image-1}" alt="{title}" title="<b>{title}</b><br/><br/>{text limit="1000"}"/><br/><center>{title}</center></a>

Выше показан исходный код шаблона, по которому формируется похожая новость в файле relatednews.tpl, показанная на скриншоте выше! Как видно, всплывающая подсказка формируется из заголовка и текста короткой новости!

Установка:

1. Скачать архив и залить файл tooltip.js в ваш шаблон в папку js
2. В main.tpl между <head></head> добавить следующий код:
<script type="text/javascript" src="{THEME}/js/tooltip.js"></script>
<script>$(document).ready(function() {$("a").easyTooltip()}); $(document).ready(function(){$("img").easyTooltip()}); </script>

3. В файл стилей добавить кодец:
/*Tooltip - всплывающие подсказки*/
#easyTooltip{
    max-width: 300px;
    padding:10px;
    border:1px solid #000;
    background:#000;
    color: #ccc;
    border-radius: 6px;
    opacity: 0.8;
    font-size: 15px ;
    z-index: 9999;
    box-shadow: 0px 0px 15px #000;
}


Источник: http://dlemaster.net/

Скачать Tooltip.rar Размер: 1,57 Kb Скачиваний: 298


Понравилась статья "DLE - красивые всплывающие подсказки через title, скрипт tooltip" из раздела JavaScript, Решения для DLE? Подпишись на RSS. Будь в курсе всего происходящего на сайте
Комментариев: 6 •  Просмотров: 7330   Дата: 12-апр-2014, 19:25

Похожие статьи

Комментарии

#1 Dimm   

Гости
Показывает только заголовок, а краткую новость не хочет почему-то..
(27 августа 2014 18:20) • цитировать • •

admin
Цитата: Dimm
Показывает только заголовок, а краткую новость не хочет почему-то..


{text-limit="xxx"}
где ххх - требуемое количество символов из краткой новости.

Как вариант, в вашей версии движка может не работать такая функция.

Знаю точно, что работает с 9.7, ниже не пробовал!
(27 августа 2014 21:12) • цитировать • •
#3 Dimm   

Гости
у меня версия 10.2
Самый первый код в посте я не ставил, потому как не понял куда.

Подскажите пожалуйста , куда его вставить..
(27 августа 2014 21:55) • цитировать • •

admin
Цитата: Dimm
Подскажите пожалуйста , куда его вставить..


Файл похожих новостей в шаблоне: relatednews.tpl
(27 августа 2014 23:36) • цитировать • •
#5 Dimm   

Новички
Ставил туда, не заработало, только заголовок показывается.
Спасибо за ответы Вам.
Странно, удалил всё в relatednews.tpl , заголовок все равно показывается. Может быть такое, что еще где-то поправить можно?
(28 августа 2014 00:04) • цитировать • •

admin
Цитата: Dimm
Может быть такое, что еще где-то поправить можно?


Даже не знаю. Я 10.2 не ставил, возможно там разгадка. Раз заголовок выводит, значит скрипт работает правильно.
(28 августа 2014 01:07) • цитировать • •
b
i
u
s
|
left
center
right
|
emo
color
|
hide
quote
translit

© 2010-2017 devarts.pro v 7.0: flexyflat tpl Designed by devarts
Карта сайта HTMLКарта сайта XMLПравообладателям
Яндекс.Метрика