VPF::Как создать свою подсказку - Форум программистов

Sardar

Дата 12.4.2005, 15:46 (ссылка)

(нет голосов)

Загрузка ...

Бегун

Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317

Цитата

Sardar, а почему
Цитата
любая разметка кроме таблиц

А я такого не говорил...

Цитата

Объясните, почему выбран вариант нивидиммых готовых подсказок?

Генерить контент при каждом показе подсказки имеет две проблемы: может сработать с задержкой на очень медленных компах(не реально...), каждый раз оставляет мусор за собой.

Цитата

Sardar ИЕ не хочет smile создавать узел, родителем которого является IMG.

Логически это верное поведение, тег IMG не является парным, но против спецификации от W3C, где каждая нода может иметь в себе поддерево(теоретически...)
Выборку тултипа я делал по id, следовательно можем ставить тултип куда угодно. Кстати у меня ошибка в расчёте координат, приводящая к проблеме на больших страницах под ИЕ. Переписываем по новой, извиняюсь smile

Код

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
    <title>Untitled</title>
<style type="text/css">
.tool_tip {
 position: absolute;
 visibility: hidden;
 /* styles */
 background-color: #a98df5;
}
</style>

<script type="text/javascript">
<!--
ToolTip.offsetX=20; //смещения подсказки от курсора
ToolTip.offsetY=10; //

function ToolTip(obj, text) {
  if(!obj||obj.nodeType!=1) throw "Illigal argument exception"; //обьект к кому привязываем подсказку
  //-- Разметка подсказки ---
  var tip=document.createElement("DIV");
  tip.className="tool_tip";
  tip.innerHTML=text;
  document.body.appendChild(tip);
  //-- события --
  obj.onmouseout=function (ev) {
      tip.style.visibility="hidden";
  };
  obj.onmousemove=function(ev) { //если не нужно что бы подскасзка бегала, то onmouseover
      tip.style.visibility="visible";
      if(window.event) ev=window.event;
      tip.style.left=ev.clientX + document.body.scrollLeft + ToolTip.offsetX;
      tip.style.top=ev.clientY + document.body.scrollTop + ToolTip.offsetY;
  };
}
//переберем заданные элементы, дадим подказку тем у кого есть аттрибут tooltip
//В аргументах передаем имена рассматриваемых тегов, * все теги
function initToolTips() {
//   return;
    var tags, tooltext;
    for(var i=0; i<arguments.length; i++) {
       tags=document.body.getElementsByTagName(arguments[i]);
       for(var j=0; j<tags.length; j++)
            if((tooltext=tags[j].getAttribute("tooltip"))) ToolTip(tags[j], tooltext);
   }
}
//-->
</script>
</head>

<body onload="initToolTips('SPAN','IMG')">
  <span tooltip="<b>Подсказка =)</b>">Test</span>
</body>
</html>

--------------------

Опыт - сын ошибок трудных © А. С. Пушкин
Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
Оценить мои качества можно тут.

karlito

Дата 20.11.2005, 03:03 (ссылка)

(голосов: 0)

Загрузка ...

Unregistered

Подскажите пожалуста новичку как сделать чтобы коментарии появлялись разные к разным линкам.

Цитата

<div id="test" style="visibility: hidden; position: absolute; width: 200px; height: 100px; background-color:#a5b5f3">
Я подсказка к ссылке
</div>
<a href="#" onmousemove="runtest(event, true)" onmouseout="runtest(event, false)">Test</a>

Я использовал первый пример.

Заранее благодарен.

Sardar

Дата 20.11.2005, 04:01 (ссылка)

(нет голосов)

Загрузка ...

Бегун

Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317

Вероятно создать кучу подсказок smile

И как в твоём коде стоит, задавать им постоянное место, что сразу дико работать будет при разных разрешениях экрана.

Вывод: глянуть на пост выше, там мой кодм, очень и ясный, всё делает за тебя, только текст сам задай.
Подсказки по сложней, но гораздо больше возможностей. Вообще юзаються как контекстные меню к разным элементам на странице:
http://forum.vingrad.ru/index.php?showtopi...ndpost&p=539410

--------------------

elemic

Дата 20.9.2015, 00:41 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 3
Регистрация: 19.9.2015

Репутация: нет
Всего: нет

Так как при наведение вывод атрибута тайтел сделать мгновенным? Так и не поняла...

Это сообщение отредактировал(а) elemic - 20.9.2015, 00:41

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »