В JS пока очень слабо разбираюсь, прошу подсказать, как можно реализовать следующее.
Имеется блок, содержащий обычный текст и кнопку, раскрывающую меню:
<div class="text">
<span>Обычный текст</span>
<div id="chooser" class="menuwrapper">
<button class="trigger">устройство</button>
<ul class="menu">
...
</ul>
</div>
</div>
Блок имеет position:relative; ul имеет position:absolute;
Хотелось бы предотвратить выход меню за границы окна браузера. Пытаюсь получить координату левой границы меню:
var c = document.querySelector('#chooser .menu');
var pos_c_left = c.getBoundingClientRect().left;
$('body').append('<div>pos_c_left: ' + pos_c_left + ', ' + $(window).width() + '</div>');
В итоге получаю неверные значения при маленькой ширине окна браузера. Выдается координата левой границы основного блока '.text'.
Каким образом вычислить координату левой границы меню (с абсолютным позиционированием) относительно границы окна браузера? Пробовал считать с offsetParent, выдает аналогичный результат.