Підказка - досить важливий елемент оформлення сучасного web сайту. А якщо її ще красиво оформити і не зловживати застосуванням.
Перейду відразу до справи:
У тілі сторінки повинен бути присутнім div з visibility = "hidden» і position = "absolute». Звичайно, його можна створювати динамічно, але це я залишаю на ваш розсуд, як, власне, і його оформлення. Використовувати tooltip потрібно так:
- функція tooltip власне, викликає поява підказки, як параметри приймає елемент, який викликав tooltip і текст підказки
- функція hide_info приховує tooltip
- функція ietruebody потрібна для того, щоб врахувати кривизну IE різних версій
- функція positiontip позиціонує tooltip під час руху миші над цільовим об'єктом
- функція appear забезпечує плавне поява підказки
наведіть курсор на текст нижче:
Застосовувати можна абсолютно до всіх елементів. Зауважте також, що нічого не заважає нам використовувати html теги в тексті підказки.
Незрозуміло, як використовувати даний скрипт ... Де і як виглядає елемент з id = # 'mess #'? У мене скрипт не працює, IE видає помилку, в інших браузерах нічого не відбувається. Спробував розібратися як зроблена ця підказка на даній сторінці, але і тут нічого не зрозумів. Навіть ту ж саму функцію tooltip і загадковий елемент з id = # 'mess #' не зміг знайти. Чи можна дати скрипт даної підказки просто в коді html без всяких підключень скриптів, щоб можна було скопіювати в браузері і вставити в файл з розширенням html?
А якщо ще й на jQuery переписати - так взагалі буде коротко. До речі, можна як-небудь зробити, щоб розпізнав атрибут rel і по ньому відбувалося дію? типу
...
Спасибі величезне відмінно працює. Супер ... Багато що знайшов на вашому сайті)) PS Кому не ясно ... id = # 'mess #' треба писати в Div ...
Дякую за приклад. Використовував на своєму сайті. Правда в IE відображається не зовсім так як треба, при позиціонуванні підказки її ширина зменшується при досягненні краю елемента.
Вітання! Чи не працює переміщення підказки. Підкажіть в чому може бути причина?
Перед застосуванням будь то вбудованих в хтмл об'єкти методів раджу перевіряти їх не таким чином: (document.getElementById ! Document.all) або (document.all ! Window.opera) або ще якимось чином, а перевіряти чи є такий метод який вам потрібен. Напрмер ось так: var cursorX = e.pageX. e.pageX. e.clientX + ietruebody (). scrollLeft; І дивно що тут написано в одних місцях змінна e в іншому event в даному скрипті це одне і те ж. Людей в оману вводять
Народ у мене проблема з цим скриптом: Якщо mess знаходиться поруч (в коді) із зухвалим об'ктом, то все працює (але інші об'єкти перекривають його), а якщо внизу перед