Плагин использует утилиту Position библиотеки jQuery UI. Если вы посмотрите на параметры по умолчанию в source плагина, есть свойство positionOptions, которое используется в функции _refreshPosition():
options: {
transferClasses: true,
typeAhead: 1000,
style: 'dropdown',
positionOptions: {
my: "left top",
at: "left bottom",
offset: null
},
width: null,
menuWidth: null,
handleWidth: 26,
maxHeight: null,
icons: null,
format: null,
bgImage: function() {},
wrapperElement: "<div />"
}
_refreshPosition: function() {
var o = this.options;
// if its a pop-up we need to calculate the position of the selected li
if ( o.style == "popup" && !o.positionOptions.offset ) {
var selected = this._selectedOptionLi();
var _offset = "0 " + ( this.list.offset().top - selected.offset().top - ( this.newelement.outerHeight() + selected.outerHeight() ) / 2);
}
// update zIndex if jQuery UI is able to process
this.listWrap
.zIndex( this.element.zIndex() + 1 )
.position({
// set options for position plugin
of: o.positionOptions.of || this.newelement,
my: o.positionOptions.my,
at: o.positionOptions.at,
offset: o.positionOptions.offset || _offset,
collision: o.positionOptions.collision || 'flip'
});
}
Вы можете видеть, что он использует значение по умолчанию 'flip', если ничего не указано для опции collision утилиты позиции, которая есть. Согласно документации jQuery UI:
flip : на противоположную сторону, и обнаружение столкновения запускается снова, чтобы посмотреть, подойдет ли оно. Если он не поместится ни в одной из позиций, следует использовать опцию по центру.
fit : поэтому элемент удерживается в нужном направлении, но перемещается так, чтобы он соответствовал.
нет : не обнаруживать столкновения.
Так что я думаю, вы могли бы передать опцию при инициализации плагина, чтобы определить none для опции коллизии:
$('select').selectmenu({
positionOptions: {
collision: 'none'
}
});
Еще не тестировали, просто посмотрите на код.
Редактировать следующий комментарий
Я заметил, что версия javascript, доступная на github, и версия, используемая на веб-сайте плагина, не совпадают. Я не знаю, какой из них вы используете, но тот, который используется на веб-сайте, на самом деле не имеет опции positionOptions, поэтому не имеет смысла указывать его при вызове selectmenu().
Кажется, что невозможно напрямую ссылаться на javascript на сайте, так что вот код для иллюстрации:
defaults: {
transferClasses: true,
style: 'popup',
width: null,
menuWidth: null,
handleWidth: 26,
maxHeight: null,
icons: null,
format: null
}
_refreshPosition: function(){
//set left value
this.list.css('left', this.newelement.offset().left);
//set top value
var menuTop = this.newelement.offset().top;
var scrolledAmt = this.list[0].scrollTop;
this.list.find('li:lt('+this._selectedIndex()+')').each(function(){
scrolledAmt -= $(this).outerHeight();
});
if(this.newelement.is('.'+this.widgetBaseClass+'-popup')){
menuTop+=scrolledAmt;
this.list.css('top', menuTop);
}
else {
menuTop += this.newelement.height();
this.list.css('top', menuTop);
}
}
Мне удалось заставить его работать, как я впервые описал с версией из github . На мой взгляд, это более свежая / полная версия. Кроме того, он был обновлен несколько дней назад.
Я создал небольшую тестовую страницу с двумя вариантами выбора. Я изменил обе позиции для раскрывающегося списка, показанного выше.
В первом не указана опция столкновения, поэтому используется «переворот», и раскрывающийся список отображается ниже, потому что сверху недостаточно места.
Для второй не указано «none», и раскрывающийся список отображается выше, даже если места недостаточно.
Я поместил небольшой тестовый проект на свой dropbox .