Всплывающие подсказки jQuery Tools не работают просто из-за внешнего div, имеющего позицию:

Question

Подсказка jQuery от стороннего разработчика - jQuery Tools. Подсказки: всплывающие подсказки выполнены правильно. Может ли он сломаться, просто имея внешний div сposition: relative?

Это работает: http://www.topics2look.com/code-examples/jquery-tools-tooltip-bug/this-works.html

Просто добавивposition: relativeк внешнему элементу div (тот, что с синей рамкой), и всплывающая подсказка становится неуместной (независимо от того, на какую величину заголовок перемещается вниз): http://www.topics2look.com/code-examples/jquery-tools-tooltip-bug/with-relative-position-it-does-not-work.html

Качество стороннего открытого исходного кода.

У любого гуру jQuery есть быстрое исправление? Требование заключается в том, что внешний div должен иметь position: relative или же position: absolute по той или иной причине. Я думаю, что причина этого заключается в том, что jQuery Tools Tooltip использует position: absoluteпозиционировать всплывающую подсказку, но не зная, чтоabsoluteна самом деле относительно "ближайшего предка, который расположен", как говорится в спецификации CSS. Так что это просто, просто.

Answer 1

Попробуйте использовать relative собственность (третий снизу).

$('#main-content').tooltip({
    bounce: false,
    relative: true, // <-- Adding this should sort you out
    slideOffset: 5,
    effect: 'slide',
    direction: 'down',
    slideInSpeed: 300,
    slideOutSpeed: 200,
    position: 'bottom center'
});