2015-11-11 21 views
2

你好我正在使用selectize插件創建標籤到我的網站一切都很好,除了下拉項目被我的其他divs重疊。selectize drop item總是在前面

我希望他們的行爲像選擇項目是絕對的,並始終在frnt。

我已經嘗試過使用絕對和z-index定位,但沒有幫助 如果你能向我推薦一些有關插件的東西,那將會很棒。

 <script src="tags/selectize.js"></script> 
    <link rel="stylesheet" href="tags/selectize.default.css"/> 
<div class="control-group"> 
       <select id="<?=$getid_i?>" multiple name="dept[]" class="demo-default" > 
        <option value=""><?=$placehol?></option> 
        <?php if ($tagwhats =='depts'){ 
       // something to get .... 
       } else if($tagwhats =='skills'){ 
       // something here ... 
       } ?> 
       </select> 
      </div> 
<script> 
       var eventHandler = function(name) { 
       return function() { 
        console.log(name, arguments); 
        $('#log').append('<div><span class="name">' + name + '</span></div>'); 
       }; 
      }; 
      var $select = $('#'+"<?=$getid_i?>").selectize({ 
       create   : true, 
       onChange  : eventHandler('onChange'), 
       onItemAdd  : eventHandler('onItemAdd'), 
       onItemRemove : eventHandler('onItemRemove'), 
       onOptionAdd  : eventHandler('onOptionAdd'), 
       onOptionRemove : eventHandler('onOptionRemove'), 
       onDropdownOpen : eventHandler('onDropdownOpen'), 
       onDropdownClose : eventHandler('onDropdownClose'), 
       onFocus   : eventHandler('onFocus'), 
       onBlur   : eventHandler('onBlur'), 
       onInitialize : eventHandler('onInitialize'), 
       }); 
       </script> 
+0

我想我在做什麼只是調用此預先創建的div內有300像素的寬度和高度40點時,下拉顯示它應該克服div和秀。現在它顯示,但它被隱藏,因爲主div的高度只有40px –

回答

1

在selectize.css您可以下拉改變z-index。以下作品在我的網站上:

.selectize-dropdown { 
    position: absolute; 
    z-index: 10000; /* adjust as necessary */ 
    border: 1px solid #d0d0d0; 
    background: #ffffff; 
    margin: -1px 0 0 0; 
    border-top: 0 none; 
} 
+0

對不起,但沒有爲我工作我正在做的只是調用這個預先創建的div與300px寬度和40px高度我希望當下拉顯示它應該超過div並顯示。現在它顯示,但它被隱藏,因爲主div的高度只有40px –

1

忘掉selectize.css類。什麼工作對我來說是:
具有以下創建另一個類:

.myNewClass { 
    position: absolute !important; 
    z-index: 999; 
} 

,並把這個班你<select>標籤內。
之後,你應該重新調整你的元素,但問題可能會得到解決。

0

我使用UIKit的3.x和這對我的作品

.selectize-dropdown-content { 
    z-index: 999; 
    background: white; 
    border: 1px solid #e5e5e5; // this is optional 
}