Selectmenu: improved width handling and visual style

This commit is contained in:
Felix Nagel 2011-09-28 00:03:52 +02:00
parent 68a369911a
commit fd69abb8d0
2 changed files with 5 additions and 4 deletions

View File

@ -11,10 +11,10 @@
.ui-selectmenu-menu { padding: 0; margin: 0; position:absolute; top: 0; display: none; }
.ui-selectmenu-menu .ui-menu .ui-menu-item { width: auto; }
.ui-selectmenu-menu .ui-menu .ui-menu-item a { padding: 0.3em 1em 0.3em 1em; }
.ui-selectmenu-menu .ui-menu .ui-menu-item a.ui-state-focus { margin: -1px 0 -1px -1px; }
.ui-selectmenu-menu .ui-menu li.ui-state-disabled { margin: 0; padding: 0; }
.ui-selectmenu-menu .ui-menu li.ui-selectmenu-optgroup { font-weight: bold; line-height: 1.5; padding: 2px 0.4em; margin: 0.5em 0 0 0; }
.ui-selectmenu-open { display: block; }
.ui-selectmenu-button { margin-right: 0; }
.ui-selectmenu-button span.ui-icon { right: 0.5em; left: auto; }
.ui-selectmenu-button span.ui-button-text { text-align: left; padding: 0.4em 2.1em 0.4em 1em }

View File

@ -42,7 +42,7 @@ $.widget( "ui.selectmenu", {
_create: function() {
var self = this,
options = this.options,
tabindex = this.element.attr( 'tabindex' )
tabindex = this.element.attr( 'tabindex' ),
// set a default id value, generate a new random one if not set by developer
selectmenuId = self.element.attr( 'id' ) || 'ui-selectmenu-' + Math.random().toString( 16 ).slice( 2, 10 );
@ -72,7 +72,7 @@ $.widget( "ui.selectmenu", {
tabindex: ( tabindex ? tabindex : self.element.attr( 'disabled' ) ? 1 : 0 ),
id: self.ids[ 0 ],
css: {
width: self.element.width()
width: self.element.outerWidth()
},
'aria-disabled': options.disabled,
'aria-owns': self.ids[ 1 ],
@ -172,9 +172,10 @@ $.widget( "ui.selectmenu", {
});
// wrap list
var newelementWidth = self.newelement.outerWidth();
self.listWrap = $( options.wrapperElement )
.addClass( self.widgetBaseClass + '-menu' )
.css( "width", ( options.dropdown ) ? self.element.width() : self.element.width() - options.iconWidth )
.width( ( options.dropdown ) ? newelementWidth : newelementWidth - options.iconWidth )
.append( self.list )
.appendTo( options.appendTo );