n-wp.ru — блог о WordPress
Как сделать красивые подсказки для ссылок | скрипт qTip | n-wp.ru

Как сделать красивые подсказки для ссылок | скрипт qTip

Иногда мне, чтобы решить какую-то нетипичную задачу, приходится изучать java-скрипты, PHP, CSS. И это не удивительно — бывает проще решить эту задачу внедрением скрипта, нежели чем поиском подходящего плагина. Так и в этот раз получилось — мне нужно было создать красивые, полупрозрачные подсказки, появляющиеся над ссылками. Я прибегнул к уже проверенному методу — использовал jQuery-скрипт qTip.

Как сделать красивые подсказки для ссылок | скрипт qTip

Этот скрипт весьма разносторонний, но меня интересовало только создание красивых всплывающих подсказок над ссылками. Буду предельно краток, и выложу готовый рецепт создания таковых.

Для начала нужно скачать скрипт — он крошечный, всего 3 kb. Я использую упрощенную версию для ссылок.

Скачать
скрипт qTip
вы перейдете по ссылке http://dl.dropbox.com/u/2027201/Wordpress/Scripts/qTip.js

После этого нужно его подключить. Перепишите скрипт в папку с темой (для скриптов я всегда использую папку js в папке с темой). Откройте файл header.php, и до открывающегося тега body вставьте код:

Все, скрипт подключен. Не забудбье проверить, подключена ли библиотека jQuery. Теперь скрипт нужно активировать, чтобы он начал действовать. Для этого откройте файл footer.php, и до закрывающегося тега body вставьте код:

Все, скрипт начал действовать — он автоматически находит ссылки, и если в них есть title, то заменяет стандартные подсказки, которые отображает браузер, на что-то свое. осталось только задать вид всплывающих подсказок. Для этого откройте файл style.css, и вставьте в него примерно следующее:

Как видите, вы можете добавить к всплывающим подсказкам любое оформление — цвет, шрифты, и даже полупрозрачность. если вы хотите изучить скрипт и его возможности более подробно, посмотреть на результат работы, то посетите его страницу.

Посмотреть
qTip
вы перейдете по ссылке http://craigsworks.com/projects/qtip/demos/

tiaurus

Являюсь создателем n-wp.ru — блога о WordPress для новичков. Мне интересно многое, поэтому еще я сделал 123-box.ru — блог о программах для Windows, и tiaurus.info — блог о красоте.

8 комментариев

/* ]]> */