Дочерний элемент (всплывающая подсказка к изображению) обрезается внутри родительского элемента div с фиксированной шириной и скрытым переполнением - PullRequest
1 голос
/ 07 января 2012

У меня есть родительский div с фиксированной шириной и скрытым переполнением.У родительского div есть несколько изображений, которые я прокручиваю, используя пользовательский Javascript.Для каждого изображения у меня есть всплывающая подсказка, которую я хочу показать при наведении мыши на изображения.Всплывающие подсказки большие и обрезаются при наведении мыши на изображения, так как родительский div скрыт переполнением.Каково лучшее решение этой проблемы.Я много смотрел вокруг и не нашел ни одного возможного решения.

Любая помощь действительно ценится.Спасибо

1 Ответ

1 голос
/ 07 января 2012

Я предлагаю вам, чтобы элементы всплывающей подсказки были дочерними элементами ТЕЛА, поэтому они не будут вырезаны.Чтобы отобразить подсказку в положении относительно изображения, вам необходимо знать положение изображения относительно ТЕЛА.Вот метод, который я использую:

function getPosition(element)
{
var position = {x:-1, y:-1};

// no element //
if (element === null) return position;

// getting offset parent
var offsetParentNode = document.body; 

// calculating position //
position.x = 0;
position.y = 0;
var _parent = element;
while (_parent !== offsetParentNode && _parent !== document.body && _parent !== null)
{
    position.x += _parent.offsetLeft;   
    position.x -= _parent.scrollLeft;
    position.y += _parent.offsetTop;    
    position.y -= _parent.scrollTop;
    _parent = _parent.offsetParent;
}

if (offsetParentNode !== document.body && (_parent === document.body || _parent === null))
{
    position.x = -1;
    position.y = -1;
}

return position;
}
...