2013-05-31 1 views
0

Я использую библиотеку jquery.multiselect, которая отлично работает в хроме.jQuery UI multiselect компоненты рендеринга вдали от фактического управления

Я использую стили CSS, которые могут быть просмотрены here

Использование:

$("#component").multiselect(
      { 
       multiple: true, 
       height: '30px', 
       selectedText: "# selected", 
       noneSelectedText: "Select Items", 
       checkAllText: "All", 
       uncheckAllText: "None"    
      }); 

Это работает отлично в хроме, но при попытке просмотра в Firefox или IE, при открытии выберите , он прокладывает путь вниз в левую нижнюю часть экрана, и похоже, что z-index не работает вообще. Я изучил это немного, и похоже, что может быть ошибка с jQuery 1.8.1 (которую я использую), однако hotfix , похоже, не работает.

Любые идеи относительно того, почему это будет работать в хроме, но не в других браузерах?

Вопрос об here кажется очень похожим, также.

Также может быть полезно отметить, что я размещаю combobox внутри аккордеона, но поскольку он работает в хроме, я уверен, что это не должно быть проблемой. Меня беспокоит, что позиция: абсолютная (в некоторых стилях) может вызвать проблемы в некоторых браузерах, но это может быть красная селедка.

Я потерялся на этом, пожалуйста, помогите! Благодарю.

+1

Это, вероятно, просто исправить (может быть, несколько строк CSS), и это гораздо более вероятно, ошибка в вашей реализации, а не ошибка jqueryui. Вы должны опубликовать разметку и все свои css на jsfiddle или иметь общедоступную страницу. – Ringo

ответ

2

Один трюк, который вы можете попробовать, - использовать инспектор firebug или chrome для выяснения нарушающего элемента - самого внешнего элемента, который не там, где он должен быть. Попробуйте добавить «position: relative» к родительскому элементу этого элемента. Вероятно, это будет, по крайней мере, ближе к тому, где вам это нужно. Если это не сработает, попробуйте добавить «position: relative» к родительскому родителю и так далее, пока проблема не будет исправлена.

3

Если вы используете jQuery 1.8+, это может быть вызвано новой реализацией outerHeight(false).

В JQuery-щ-MultiSelect-виджет версии 1,13 исходной строки 573: сверху: pos.top + button.outerHeight(),

изменения это:

top: pos.top + button.outerHeight(false), 

фиксированная моя проблема ,

+0

Да, это была проблема. –

0

Не знаю, почему, в моей версии multiselect position: absolute отсутствовал в стилях для выпадающего списка и вызывал проблему в некоторых сценариях.

Добавление к .ui-multiselect-menu класс решил проблему.

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