2015-11-24 3 views
0

Скрипача, чтобы продемонстрировать Контент HTMLHTML элемент скрывается за другой элемент

https://jsfiddle.net/ASel1984/dd9gpnot/4/

code in the fiddle

Здесь у меня есть самозагрузки кнопки, которая будет отображаться меню падения на мыши.

Когда я нажимаю на кнопку, содержимое меню перехода скрывается за заголовком заголовка. Как я могу показать пункты меню перехода над заголовком заголовка?

Примечание. Я хочу показать только пункты меню перехода над заголовком заголовка.

ответ

0

Просто дайте ваш UL «выпадающее меню тянуть правый» элемент position:relative так:
<ul class="dropdown-menu pull-right" style="position:relative" role="menu">

https://jsfiddle.net/dd9gpnot/1/

+0

Это то, что я не могу сделать. На самом деле, Up on resize window Я устанавливаю класс dropup для меню, когда нет нижней части для отображения. Спасибо за ваше предложение. – user472269

1

Так актуальная проблема с меню dropup не была, что он прятался за заголовком но что он основывал его выравнивание от родительского div.

   <div class="header-space"> 
       <br/><br/><br/> 
       <br/><br/><br/> 
       </div> 
       <div class="btn-group dropup"> 
       <button class="btn btn-xs dropdown-toggle" aria-haspopup="true" aria-expanded="false" type="button" id="dropupMenu" data-toggle="dropdown">Add Button<span class="caret"></span></button> 
       <ul class="dropdown-menu dropdown-menu-right" role="menu" area-labelledby="dropupMenu"> 
        <li><a href="#">Link 1</a></li> 
        <li><a href="#">Link 2</a></li>     
        <li><a href="#">Link 3</a></li> 
        <li><a href="#">Link 4</a></li> 
        <li><a href="#">Link 5</a></li>     
       </ul> 
       </div> 

Здесь можно увидеть, что, сделав ДИВ завернуть пространство заголовка, а затем отдельный DIV оберточного фактические ниспадающий будет выровнять всплывающее окно с верхней частью кнопки, так что теперь в верхней части, что дела. Теперь вы можете сделать свой текст таким, как вы хотите, над этим пространством заголовков, указав ширину и высоту его элементов по своему вкусу. Надеюсь, это поможет!

Редактировать: Я вижу, что вы обновили код, чтобы выровнять выравнивание правильно сейчас, и я не совсем уверен, что последний фрагмент, который вы пытаетесь решить, является. Я думаю, вы говорите, что хотите, чтобы выпадающий сидел поверх «div1», который держит таблицу. Если это правильно, это может быть сделано путем установки перепускной-у видимого следующий образом:

   .div2 { 
        overflow-y: visible; 
        height: calc(100vh - 50px); 
        border:2px solid red; 
       } 

Если я недопонимание вашей цели, и вы могли порадовать переформулировать этот вопрос с более специфическим я был бы счастлив, чтобы оглянуться назад над ним.

+0

Я только что обновил свой оригинальный jsfiddle. Чтобы продемонстрировать фактическую проблему – user472269

+0

Просто отредактировал мой ответ, чтобы помочь с тем, на что, как я думаю, вы стремитесь. –

Смежные вопросы