Не нравятся результаты поиска? Попробуйте другой поиск!
DLE FAQ » Все вопросы » Общие вопросы по вёрстке » Реализация всплывающих подсказок с выводом контента в dle

Реализация всплывающих подсказок с выводом контента в dle


     01.10.2012    jquery, dle, подсказка    Все вопросы » Общие вопросы по вёрстке    5318

вопрос
Здравствуйте! Сейчас на многих сайтах можно увидеть всплывающие подсказки в которых выводится картинка и описание новости. Вот и мне захотелось такое реализовать на своем сайте. Проанализировав исходный код пару сайтов где стоят такие подсказки, я понял что за это отвечает плагин BetterTip для jQuery. Ну я сразу же погуглил и нашел его с нормальным описанием вот здесь. Как мне стало понятно скрипт подгружает специально созданную html страницу и выводит ее в подсказке.
Реализация всплывающих подсказок с выводом контента в dle

Я хочу подключить данный плагин к блоку "популярные новости".
Вопрос заключается в том, как вывести в подсказку tpl страницу с поддержкой тегa {image-x} и доп. полей. ?
Смотрел как сделано на других сайтах но так и не понял как они это реализовали. Подскажите пожалуйста как можно сие чудо сотворить.

Ответа пока нет


22 комментария

ПафНутиЙ
Админ

ПафНутиЙ - 1 октября 2012 21:02 -

Не обязательно это делать через тот плагин, тут например это реализовано на bootstrap popover (<< рабочий пример)

Каков вопрос - таков и ответ. Просто помните об этом.

Prowockator
Юзер

Prowockator - 2 октября 2012 17:31 -

Спасибо плагин я нашел, но нифига не пойму как его подключить там документация вся на енглише. Может быть Вы мне подскажете как им правильно пользоваться ??

ПафНутиЙ
Админ

ПафНутиЙ - 2 октября 2012 17:35 -

Ну так там же пример есть, скопируйте исх код. и скачайте кастомизированный bootstrap.js (там галочками можно отмечать нужные плагины) - вам нужно tooltip и popover

Каков вопрос - таков и ответ. Просто помните об этом.

Prowockator
Юзер

Prowockator - 2 октября 2012 22:15 -

Скачал я архив в нем файл bootstrap.js и bootstrap.css. Подключил к шаблону оба файла. А теперь не могу ето все собрать до кучи. Помогите написать правильную html разметку и как активировать сам плагин.
Я прописал это:
<script type="text/javascript">
       $(function(){
           $('#element').popover('show')
        });
    </script>

и это:
<a href="#" id="element" rel="popover"data-content="тра-ля-ля">hover over me</a>

и ничерта не произошло ) просто я маловато в этом понимаю.

Prowockator
Юзер

Prowockator - 3 октября 2012 14:12 -

ПафНутиЙ,
Ну так поможете или нет ?

Mr. Hyde
Юзер

Mr. Hyde - 3 октября 2012 14:58 -

<a href="/" rel="popover" data-placement="top" title="text" data-content="text">Dle Code</a>

Prowockator
Юзер

Prowockator - 3 октября 2012 15:57 -

Ну так у меня тоже самое кроме data-placement="top" Что ето?

ПафНутиЙ
Админ

ПафНутиЙ - 3 октября 2012 17:06 -

адрес сайта в студию.

Каков вопрос - таков и ответ. Просто помните об этом.

Prowockator
Юзер

Prowockator - 3 октября 2012 17:52 -

ПафНутиЙ, я этот плагин пока только на денвер устанавливал.

ПафНутиЙ
Админ

ПафНутиЙ - 3 октября 2012 20:00 -

ну тогда я бессилен.

Каков вопрос - таков и ответ. Просто помните об этом.

Prowockator
Юзер

Prowockator - 4 октября 2012 12:47 -

ПафНутиЙ, С выводом подсказки разобрался: data-original-title - это заголовок подсказки, а data-content - это сама подсказка. Но мне нужно чтобы эта подсказка подгружалась во время когда на ссылку наводят курсор, а не сразу со всей страницей. Вот в вашем коде на этой странице непонятно от куда она берется:
<div id='comm-id-7608'>Не обязательно это делать через тот плагин, тут например это реализовано на <cite class="wtf">bootstrap popover</cite> (&lt;&lt; рабочий пример)</div>                
            </div>

Как Вы это реализовали ??

nowheremany
Эксперт

nowheremany - 4 октября 2012 13:26 -

Трудно почитать документацию?
http://twitter.github.com/bootstrap/javascript.html#popovers

Благодарность принимаю тут Связь

Prowockator
Юзер

Prowockator - 4 октября 2012 13:35 -

nowheremany, 404 - There isn't a GitHub Page hosted here, sorry.

nowheremany
Эксперт

nowheremany - 4 октября 2012 14:08 -

конечно скопировать ссылку сложновато в url

Благодарность принимаю тут Связь

Prowockator
Юзер

Prowockator - 4 октября 2012 14:37 -

nowheremany, Нет не сложно, но там это не описано !!!!!

ПафНутиЙ
Админ

ПафНутиЙ - 4 октября 2012 14:05 -

Яваскриптом. Текст, ссылка и картинка вставляются через js-обработчик

Каков вопрос - таков и ответ. Просто помните об этом.

Prowockator
Юзер

Prowockator - 4 октября 2012 14:41 -

ПафНутиЙ, Ясно, это для меня сложно. Прийдется отказаться от данной затеи.((

kovalenko3331
Юзер

kovalenko3331 - 3 октября 2012 18:56 -

ПафНутиЙ, прикольный плагин, думал себе тоже кстати прикрутить BetterTip, но твой тоже понравился, надо посмотреть что за зверь. Спасибо.

monach
Юзер

monach - 2 декабря 2012 14:46 -

Ето самое простое что можна было бы написать самому

evanstone
Юзер

evanstone - 11 января 2014 12:04 -

боже, учите русский язык...

Prowockator
Юзер

Prowockator - 11 января 2014 12:10 -

О сенсей как же мы тебя долго ждали ))))

nambo1
Юзер

nambo1 - 11 января 2014 12:28 -

evanstone,
Скорее учить нужно английский, на нем больше документация

Чтобы комментировать - войдите или зарегистрируйтесь на сайте

Похожие вопросы

наверх