Pull to refresh

Comments 40

Это простой способ создания тултипов?
В чем преимущества вашего метода перед стандартным jQuery Tooltip Plugin?

UFO landed and left these words here
Идейно ничего сложного нет: все крутится вокруг mouseover/mouseout, эстеты еще события используют.
+ время на дебаг в разных браузерах
Наверное, у автора получилось менее объёмный код написать. Но jQuery Tooltip Plugin с другой стороны, более функционален. В большинстве случаев не нужна вся функциональность плагинов.
Как раз если сравнить тот код, который надо писать и дебагать самому, а не тот который уже написан и оттестирован :), то получится стандартный способ проще.
Наверное, всё-таки, это зависит от человека и от того, насколько у него много времени: мне кажется проще написать что-то своё, если требуются мелочи.
это вопрос не преимущества одного способа над другим, а краткий мануал по написанию своего tooltip-а, если вам нравится стандартный jQuery Tooltip Plugin, то, пожалуйста, используйте, но если хотите написать свой tooltip, то, надеюсь, эта статья вам поможет. Тут важно понимание того как все работает, + немного фантазии, и даже новичок может написать свой собственный tooltip добавив и расширив его возможности.
Например, на странице автора статьи вы можете увидеть как он использовал tooltip в своем портфолио.
За код с подобными комментариями спасибо. Поставил +.
Мне как раз актуальна эта тема — надо в одном проекте улучшить тултипу.
Но лично мне было бы интереснее прочитать как создать плагин, чтобы использовать его совсем по-jquery-ному :) — с его стандартами вызовов и т. п.

размер этого тултипа — 1.2кб против 8кб для jQuery Tooltip Plugin.
Вот вам самое главное отличие. Чем проще и менее наворочен компонент, тем лучше.
Я считаю, что большего, чем этот тултип и не нужно, если не заниматься всякими извращениями.
Несколько килобайт для файла загружаемого 1 раз ничего не значат.
Зато функционал гораздо больше.
а зачем нужно больше функционала чем здесь?
UFO landed and left these words here
да уж… очень просто способ :-)
в свое время делал нечто похожее, кода меньше
(особенно если учесть что не пользовался никакими библиотеками)
+ учитывал что если экран на всплывающем блоке внезапно оборвется — то этот блок уйдет в другую сторону
Не понимаю, зачем это надо. Сейчас это действительно ширико используется, но вот цель и задачи непонятны. Ссылка «Главная» — тултип: «Перейти на главную». Это подсказка для дебилов что-ли? Для подсказки есть стандартная запись без всякого яваскрипта, которую выводят все браузеры. Зачем вывешивать дурацкие подсказки в отдельном окне — непонятно.
ну смысла в подсказке — «Главная» — тултип: «Перейти на главную» действительно нет, тут, как и в любом деле, нужно использовать tooltip c умом, там где он действительно нужен, к тому же tooltip можно применять не только к ссылкам, но и, например, к изображениям.
Ну ваш пример это да, а вот если вам нужно при наведении выдать подсказку с графическим указанием и какой то разметкой? тогда уже стандартный не выводится… и на сколько я помню то ФФ не выводит стандартных тултипов…

А статья была бы более полезной если было бы еще описано как это оформить как плагин к JQ возможно далбы толчек созданию новых плагинов для JQ Tooltip
а в чем проблема? там на странице автора, да и у меня, есть пример tooltip-a с картинкой, в статье даются только основы, базовые понятия, а если немного пофантазировать, то можно можно написать совсем не плохой плагин, не хуже уже существующий, а может и лучше :)
В вашем примере, если быстро водить мышкой над ссылками, анимация проигрывается словно с запозданием (коряво изъяснился, но надеюсь поймете). Выглядит это не очень. Можно ли как то избавиться от случайных срабатываний? Спрашиваю, потому что столкнулся сам с подобным «эффектом» и как избавиться не придумал/нашел (пока только изучаю jquery).
можно сделать проверку: если курсор находится над ссылкой некоторое время (например 0.3 сек) то запускается анимация.
если вы быстро провели над ссылкой — никакой тултип не появляется.
setTimeout вам в помощь
спасибо, не попадалась эта функция на глаза раньше.
Stalker_RED предложил похоже то что мне нужно.
UFO landed and left these words here
Booble — это скорее сиська,
Вы вероятно имели ввиду — Bubble :)
UFO landed and left these words here
стесняюсь спросить (с), и что здесь общего? вы исходный код смотрели?
вы не поняли смысл статьи, тут не ставилась цель «открыть» миру такую замечательную фичу как tooltip, таких скриптов в сети десятки, скорее автор попытался пошагово описать процесс создания tooltip-а.
Другое дело если вы не хотите писать самостоятельно скрипты, тогда можете юзать ajaxrain.com.

P.S. При чем здесь Bubble Tooltip я не совсем понял, если это вы так решили из-за картинки в начале статьи, то я ее вставил просто для иллюстрации, выглядеть tooltip может как угодно.
UFO landed and left these words here
Третья строка функции — $(«body»).append(""+$(this).attr('title')+""); — не вся у Вас пропечаталась.
ой, спасибо, исправил, это «нехороший» редактор html-теги спрятал
Ваш тултип, к сожалению, из т. н. «тупых», т. е. таких, которые не учитывают расположение элемента относительно края окна. Если, например, элемент окажется близко к правому краю, то тултип не «догадается» переметнуться влево. То же касается и вертикальных отношений.

А написать тултип именно что на jQuery — это просто развлечение, поскольку в этом фреймворке есть все необходимые кроссбраузерные данные и команды.
ну так вперед, основа уже есть, предложите свой «умный» tooltip. желательно с подробными комментариями, и я уверен куча народа будет вам благодарна
Я возможно получу кучку минусов за свое недопонимание, но вот у меня вопрос. (я тоже нуб и со многим еще разбираюсь в js)

разве приведенный код не есть пример злостного замыкания, которое отожрет пямять?
объясню что имею ввиду — внутри each(function(i){ создается переменная my_tooltip
к которой идеть обращение в функциях на события мыши. Насколько я понял из Рейсиговской книжки (Джон Рейсиг — автор jQuery) то после окончания работы функции которая вызывается в each(function(i){
реально переменная my_tooltip не умрет так как создалось «замыкание»

Поправьте меня если я не прав, может сам себя переумничал…

Второй вопрос: почему бы не использовать один и тот же tooltip получая его ну скажем через getElementById? и меня ему title?
Если вызывать тултип у края экрана, появляется горизонтальный скрол.
Only those users with full accounts are able to leave comments. Log in, please.