не удалось показать подсказку при наведении мыши, jquery1.11

0

Мое требование - показать всплывающую подсказку на изображении мыши. Я использую jquery1.11. Но я не могу этого добиться. Это моя скрипка

Я хочу показать ниже данные таблицы в подсказке при наведении указателя мыши на изображение:

<table class="statusRollup" style="position:absolute;">
    <tr><td>tooltip Data1 </td></tr>
    <tr><td>tooltip Data2</td></tr>
</table>

Образец кода:

$.widget("ui.tooltip", $.ui.tooltip, {
    options: {
        content: function () {
            return $(this).prop('title');
        }
    }
});

$(function () {
    $('.one').attr('title', $('.statusRollup').remove().html())
    $(document).tooltip();
});

Есть ли у них какие-то предложения?

Благодарю.

Теги:

1 ответ

2
Лучший ответ

У вас это работает, вам просто нужно применить атрибут title="" к элементам, которые вы хотите иметь всплывающую подсказку.

<td class="sample-two">Row1 
<img class="one" src="http://ssl.gstatic.com/gb/images/b_5dae6e31.png" 
width="15" height="15" alt="" title="testing"/>

Рабочий JSFiddle: http://jsfiddle.net/ubKtd/1132/

row1 img говорит тестирование.

Также я предлагаю посетить: http://jqueryui.com/tooltip/

Если вам нужны то, что вы просили в комментариях здесь:

JS:

$(function () {
      $(document).tooltip({
          content: function () {
              return $(this).prop('title');
          }
      });
  });

$(function () {
    $('.one').attr('title', $('.statusRollup').remove().html())
    $(document).tooltip();
});

Также добавлен пользовательский интерфейс jQuery, поскольку он не был добавлен из того, что я видел:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/themes/smoothness/jquery-ui.css" />
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js"></script>

Рабочий JSFiddle: http://jsfiddle.net/0w9yo8x6/3/ * Использование jQuery 1.11.1 *

Поделиться
  • 0
    Мое требование - показать всю таблицу внутри всплывающей подсказки, и я не могу добавить этот код в заголовок, как было предложено. @ Просто Крэйг
  • 0
    @ user3684675 Обновлено и добавлено то, что вы просили в комментариях.
Показать ещё 7 комментариев

Ещё вопросы

Сообщество Overcoder
Наверх
Меню