Всплывающая подсказка v.2
Вспоминаем мой давний пост про плавающую над объектами подсказку.
Феатурес:
- Вторая версия написана с использованием библиотеки jQuery (кстати, очень рекомендую обратить внимание, не такая громоздкая как Prototype)
- Запуск скрипта осуществялется средставми jQuery, в сам html-файл ничего не нужно вписывать
- В настройках скрипта можно указать в каких тэгах будет работать подсказка
- Подсказки прописываются в атрибут rel, хотя можно использовать любой другой атрибут, например title или alt, достаточно прописать его в настройках скрипта. Проблема только в валидации кода
- Добавлена функция простого парсинга, заменяющего знаки “[" на "<" и "]” на “>”, чтобы можно было добавлять в подсказки простые псевдо-тэги
- Проверено в браузерах: Mozilla Firefox 2.0.0.6, Opera 9.23, Internet Explorer 5.5+, Safari 3.0.3, Swift 0.2
Ну вот вроде и всё. Смотрим работающий пример.






]]>Sam]]>Пример надо действующий. Без него как-то ненаглядно…
»]]>Никита]]>Имеешь в виду в самом посте? Кроме исходника?
»]]>Sam]]>Да.
»]]>Никита]]>Вуаля ))
»]]>mikolka]]>Nikita – красивая штучка, придумаю куда б ее к себе прикрутить – прикручу. Спасибо.
»]]>Евгений]]>По вашей идее сделал, всплывающие подсказки в карте сайта, причем текст подсказки не в самой странице, а грузиться с сервера, пока не знаю насколько это перспективно или удобно, посмотреть можно здесь http://designformasters.info/site-map/
Пока не отлажено и зализано, набросок можно сказать.
»]]>Никита]]>Евгений, симпатично. Только проверьте присваивание координат, в некоторых случаях мышка налезает на подсказку, заставляя её мерцать
»]]>Евгений]]>Я немного, поправил, но поскольку у меня и не мерцала, то не знаю, помогло ли.
Нашел баг общий для наших реализаций, document.body.scrollLeft работает только в qurks mode, чтобы работало в стандартном режиме нужно использовать document.documentElement.scrollLeft, то же самое с document.body.scrollTop.
»]]>Никита]]>Да, теперь подсказка работает идеально.
Да, есть такое дело. Но все самые популярные браузеры поддерживают Quirks Mode. Кстати по этому поводу нашёл интересную статью http://www.quirksmode.org/view.....ility.html
»Может переведёшь и отпостишь на своём блоге?
]]>Евгений]]>Браузеры то поддерживают, но страница может отображаться либо в quirks mode (если не задан doctype), либо в стандартном режиме (если с doctype все в порядке), какой режим предпочтительней думаю объяснять не нужно.
Никита, чтобы убедиться что проблема есть, предлагаю тебе открыть пример в IE сжать окно так, чтобы появился вертикальный скрол, промотать чуть вниз и посмотреть где появляется подсказка.
Статья то хорошая, и переводить там особо нечего, а вот данные немного устарели нужно будет все оттестить самостоятельно. Я все таки взял на заметку, но когда сделаю не знаю.
»]]>dmitry]]>при скроллинге в ie6, подсказка всплывает с неправильными координатами по оси Y…
»попробуйте рабочий пример ресайзить в маленькое окно и покрутите колесиком мышки.
]]>Никита]]>Да, уже все исправил, просто пока не дошла очередь отпостить
»]]>dmitry]]>а когда отпостите?
»больно хочу в свой проект вставить. ))
]]>Никита]]>Меня этот вопрос тоже беспокоит. Времени пока нет. Сами видите, пишу редко в свой блог.
»]]>Евгений]]>dmitry, чуть выше в комментах написано в чем проблема и как править.
document.body.scrollLeft работает только в qurks mode, чтобы работало в стандартном режиме нужно использовать document.documentElement.scrollLeft, то же самое с document.body.scrollTop.
»]]>Crush]]>Спасибо, замечательная работа!
Возникла одна только некрасивость, у меня при отсутствии значимой подсказки (напр. alt=”") под курсором всплывало пустое окошко. С Вашего позволения поправил так:
if (rel != “”) {
$(“#ns_tt”).empty()
$(“#ns_tt”).append(“” + rel + “”)
$(“#ns_tt”).show()
}
Удачи Вам!
»]]>Никита]]>Crush, да, это резонно.
»]]>KOS_MOS]]>Спасибо за исходник – классная вещь!
»Правда что то в IE не работает =(
Можешь посмотреть в чем дело?
]]>Никита]]>KOS_MOS, у меня всё работает и в IE6 и в IE7.
»]]>SergiusD]]>Давно хотел сделать себе подобное. Вот увидел – начал переделывать под Prototype.js, так как его пользую постоянно.
»А потом посмотрел и решил избавиться от фрейворка вообще, тут его фкнуционал особо не используется, а малоли куда вставлять придется. Поэтому фреймворк убрался.
Результат прошу смотреть в моем блоге кому нужно.
]]>miXOnIN]]>Вот от моей тест странички,как на меня неплохо сделал:))
»http://sbm.freehostia.com/
Зацените,по полям поводите,есле хотите,то выдрать его и розобраться что к чему легко))