У меня есть область с прокруткой, содержащая всплывающие меню. Концептуально, что-то вроде этого:
<div style="overflow:auto; width:100px; height:100px">
... content here that big enough to trigger scrollbars...
<div>
<a href="javascript:$('#popup').show()">Click here</a>
<div style="position:relative">
<div id="popup"
style="display:none; position:absolute; width:150px; height:150px">
... more content. This div gets shown and hidden by jquery on click events.
</div>
</div>
</div>
</div>
Проблема заключается в том, что при всплывающем всплывающем меню она также содержится в прокручиваемом div и не отображается вне прокручиваемой области размером 100x100 пикселей независимо от того, насколько высоко я делаю z-index. Я понимаю, конечно, что в каком-то смысле именно то, что я просил, когда я сказал внешнему div переполняться: auto в первую очередь. Но для моего варианта использования это не то, что я хочу - я хочу, чтобы всплывающее меню было "сверху" и могло выходить за пределы прокручиваемой области, оставаясь в нужном месте, то есть прямо под Ссылка "Нажмите здесь". Даже если ссылка "Нажмите здесь" может перемещаться по мере прокрутки контейнера.
Я также понимаю, что есть некоторые сложные обходные пути, которые я мог бы использовать, например, поместить всплывающее окно полностью за пределы прокручиваемого div и использовать javascript для его положения. И тогда мне нужно будет реагировать на события прокрутки, чтобы переместить их, когда содержимое прокручивается и т.д. Не говоря уже о необходимости писать много кода для повторной реализации того, что "позиция: relative/position: absolute" дала мне бесплатно, что также потребует немало рефакторинга моего собственного кода, поэтому я бы предпочел избежать его.
Мне интересно, есть ли какой-нибудь простой трюк, который я могу применить к моему внутреннему div, чтобы сказать ему игнорировать его свойство "переполнения контейнера", или, в противном случае, удобный jquery script, который будет реализовывать сложные вещи для меня за кулисами, поэтому мне просто нужно позвонить, чтобы получить эффект, который я получаю после.