下拉選擇導致水平自動滾動

我有一個div和一張桌子。在div裏面有下拉菜單。 div可以水平滾動。我在下拉菜單中使用了以下工具。下拉選擇導致水平自動滾動

現在，這裏是一塊吧。

在圖像1中，您可以看到我已將水平滾動移動到了最後。現在我已經選擇了一個下拉菜單並查看發生了什麼。

圖像2的結果。水平線來到它的開頭。我不想那樣。 我希望將條放置在選擇之前的位置。這單槓是一個div內側width:200%和主要體是width:100%

代碼一個下拉：

<select data-placeholder="" class="chzn_class eighty_percent" name="currency_id_1" id="currency_id_1"> 
    <option value=""></option> 
    <option value="0">None</option> 
</select>

誰能告訴我什麼是錯的？我怎樣才能解決這個問題？

Fiddle

Exact problem

來源

2014-01-15 AtanuCSE

有一點需要提及：這並不與垂直滾動發生。 – AtanuCSE

你可以做一個jsfiddle.net？ – mplungjan

@mplungjan我不認爲這對我是可能的。如果您需要更多信息或我可以提供給您的一些代碼。 – AtanuCSE

剛剛嘗試加入溢出-Y：隱藏;財產和使寬度：100％。如果這不起作用，請嘗試刪除寬度和高度屬性並添加溢出：滾動;財產分割。

如果您提供的jsfiddle參考，我可以幫助更好。

來源

2014-01-15 05:21:06 gokul

表格很大，有14列，所以不能縮小寬度。它必須足夠大才能容納整個桌子。溢出-y：隱藏已經在那裏。沒有高度屬性。我無法改變基本的形狀。我需要停止刷新下拉元素。 – AtanuCSE

基於你的小提琴我注意到，如果我刪除禁用搜索設置從初始化JavaScript然後問題消失。

$('.chosen-select').chosen();

但是這提出了一個新的問題搜索框顯示！所以一個小小的CSS可以用來隱藏搜索框。

.chosen-search { display: none; }

我從來沒有用過harvesthq但我猜選項隱藏當有較少的搜索功能，在給定數量（10你的情況）。

因此，也許要複製此功能您無法硬編碼上述css，而是動態地使用javascript隱藏搜索框。即測試編號option元素，然後找到.chosen-search元素和.hide()它。

所以不包括風格.chosen-search { display: none; }，並使用此：

$('.chosen-select').chosen(); 

var disable_search_threshold = 10; 
$('.chosen-select').each(function (index, element) { 
    var $select = $(element); 
    if ($select.find('option').length < disable_search_threshold) { 
     $select.next('div').find('.chosen-search').hide(); 
    } 
});

FIDDLE

來源

2014-01-15 06:10:39

啊！這是基於你原來的小提琴 - 你**完全問題**小提琴是不同的！ –

感謝兄弟現在我至少明白髮生了什麼事情。但我不能隱藏搜索欄。如果是這樣，那麼使用它就沒有任何意義。這個下拉菜單可以有數百個選項。 – AtanuCSE

@AtanuCSE - 查看小提琴並添加javascript - 它有條件地隱藏搜索框，根據您在此設置的值將其設置爲'var disable_search_threshold = 10;'。 –

下拉選擇導致水平自動滾動

回答

相關問題