Эффекты на основе Java Script, jQuery и т.д.

Вариант простой универсальной подсказки

1.Move your mouse over the underlined wordsПервый пример подсказки просто к тексту, текст находится внутри <span class="tip"> to see some explanation pop up under your cursor. 2.This script uses javascript to trigger the display of a pop-up tooltip on mouseoverВторой пример подсказки просто к тексту, текст находится внутри <span class="tip"> and then keeps the tooltip stuck to the mouse. 3.If you don't care about non-standard aware browsersПодсказка к картинке и тексту, они находятся внутри <span class="tip"> and want to have 4.tooltips, have a look at the pure CSS tooltipsПример подсказки к ссылке, ссылка находится внутри <span class="tip">. 5. some text with a <span class="tip" onmouseover="tooltip('here comes the explanation');" onmouseout="exit();">tooltip</span> to pop up 6.CSS tooltips Пример подсказки к фрагменту кода, фрагмент не находится внутри <span class="tip"> Пример подсказки просто к ссылке, ссылка не находится внутри <span class="tip">	Скопируйте и вставте
	Внутри тега <HEAD> - </HEAD>
	<script type="text/javascript"> // положение подсказки отпосительно положения курсора в пикселах var offsetx = 12; // смещение подсказки от позиции курсора по Х var offsety = 8; // смещение подсказки от позиции курсора по У </script> <script type="text/javascript" src="http://skriptkpbstudio.ucoz.ru/demo_srt/podskazki/450/prost_uniwersal_podskazka.js"></script> <style type="text/css"> /* стиль подсказки / #tooltip { padding: 3px; background: #f9f9f9; border: 1px solid #ff00ff; text-align: center; font-size: smaller; opacity: .8; } / стиль выделения(подчеркивание) элемента с подсказкой, если он находятся внутри <span class="tip"> */ span.tip { border-bottom: 1px solid #eee; } span.tip span { display: none; } </style>
	Всё подписано, проблем быть не должно.
	Внутри тега <BODY> - </BODY> там где у Вас будут элементы с подсказкой.
	<!-- Тег к которому подсказка находится там-же где и подсказка, т.е. внутри <span class="tip"> --> <p>1.Move your mouse over the <span class="tip" onmouseover="tooltip('styling');" onmouseout="exit();">underlined words<span id="styling">Первый пример подсказки просто к тексту,<br>текст находится внутри <span class="tip"></span></span> to see some explanation pop up under your cursor.</p> <p>2.This script uses javascript to trigger the display of a pop-up tooltip on <span class="tip" onmouseover="tooltip('mousetip');" onmouseout="exit();">mouseover<span id="mousetip">Второй пример подсказки просто к тексту,<br>текст находится внутри <span class="tip"></span></span> and then keeps the tooltip stuck to the mouse.</p> <p>3.If you don't care about <span class="tip" onmouseover="tooltip('iebug');" onmouseout="exit();"><img src="2.png">non-standard aware browsers<span id="iebug">Подсказка к картинке и тексту,<br>они находятся внутри <span class="tip"></span></span> and want to have</p> <p>4.tooltips, have a look at the pure <span class="tip" onmouseover="tooltip('csstips');" onmouseout="exit();"><a href="#">CSS tooltips</a><span id="csstips">Пример подсказки к ссылке,<br>ссылка находится внутри <span class="tip"></span></span>.</p> <!-- Тег к которому подмказка не находится внутри <span class="tip"> --> <!-- Фрагмент кода --> <p>5.<pre onmouseover="tooltip('copythis');" onmouseout="exit();">some text with a <span class="tip" onmouseover="tooltip('here comes the explanation');" onmouseout="exit();">tooltip</span> to pop up</pre> </p> <!-- Ссылка --> <p>6.<a href="#" onmouseover="tooltip('copythiss');" onmouseout="exit();">CSS tooltips</a></p> <!-- Подсказки к фрагменту кода и ссылке --> <span class="tip"><span id="copythis">Пример подсказки к фрагменту кода,<br>фрагмент не находится внутри <span class="tip"></span></span> <span class="tip"><span id="copythiss">Пример подсказки просто к ссылке,<br>ссылка не находится внутри <span class="tip"></span></span>
Здесь приведено несколько примеров работы скрипта. Он работает следующим образом: в объект(тег) к которому нужна подсказка вставляются обработчики событий с фукциями tooltip('идентификатор подсказки'); открывающая подсказку с заданным в ней идентификатором и exit(); закрывающая подсказки. Элементы к которым есть подсказки(например слова в тексте) можно выделит(у меня подчепкиванием, но можно и по другому), для этого я помещаю их в тег <span class="tip">(но можно и по другому), так как Вы этого хотите.
И Вы будите использовать скрипт прямо из моей библиотеки не загружая его к себе на страницу. Вы экономите место и время. Если Вы хотите иметь скрипт, чтобы изменять и другие его параметры, воспользуйтесь функцией [Скачать с сервера]. Если Вы не видите этой функции в []- следовательно Вы не зарегистрированы на сайте.Вам надо зарегистрироваться и войти как Пользователь.