library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2024-11-21 11:04:24 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Selectmenu: improved visual style

Browse Source
This commit is contained in:
Felix Nagel 2011-09-22 21:20:49 +02:00
parent e70092f602
commit 8120b0d6df
2 changed files with 31 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
themes/base/jquery.ui.selectmenu.css vendored
View File

@ -10,7 +10,8 @@
.ui-selectmenu-menu { padding: 0; margin: 0; position:absolute; top: 0; display: none; }
.ui-selectmenu-menu .ui-menu { padding: 0; }
.ui-selectmenu-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-button span.ui-icon { right: 0.5em; left: auto; }
.ui-button span.ui-button-text { text-align: left; padding: 0.4em 2.1em 0.4em 1em }
.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 }

33
ui/jquery.ui.selectmenu.js vendored
View File

@ -23,6 +23,7 @@ $.widget( "ui.selectmenu", {
version: "@VERSION",
defaultElement: "<select>",
options: {
dropdown: true,
wrapperElement: "<div />",
appendTo: "body",
position: {
@ -65,18 +66,21 @@ $.widget( "ui.selectmenu", {
// create button
self.newelement = $( '<a />', {
href: '#' + selectmenuId,
tabindex: (tabindex ? tabindex : self.element.attr( 'disabled' ) ? 1 : 0),
tabindex: ( tabindex ? tabindex : self.element.attr( 'disabled' ) ? 1 : 0 ),
'aria-haspopup': true,
'aria-owns': self.ids[ 1 ],
css: {
width: self.element.width()
}
}).button({
})
.addClass( self.widgetBaseClass + '-button' )
.button({
label: self.items.eq( self.element[0].selectedIndex ).text(),
icons: {
primary: "ui-icon-triangle-2-n-s"
primary: ( options.dropdown ? 'ui-icon-triangle-1-s' : 'ui-icon-triangle-2-n-s' )
}
});
self.newelementWrap = $( options.wrapperElement )
.append( self.newelement )
.insertAfter( self.element );
@ -130,8 +134,7 @@ $.widget( "ui.selectmenu", {
}
return ret;
});
// create menu portion, append to body
self.list = $( '<ul />', {
'class': 'ui-widget ui-widget-content',
@ -167,6 +170,12 @@ $.widget( "ui.selectmenu", {
}
});
if ( options.dropdown ) {
self.list
.addClass( 'ui-corner-bottom' )
.removeClass( 'ui-corner-all' );
}
// document click closes menu
$( document ).bind( 'mousedown.selectmenu', function( event ) {
if ( self.options.open ) {
@ -190,6 +199,14 @@ $.widget( "ui.selectmenu", {
var self = this,
options = this.options;
if ( options.dropdown ) {
self.newelement
.addClass( 'ui-corner-top' )
.removeClass( 'ui-corner-all' );
}
self.listWrap.addClass( self.widgetBaseClass + '-open' );
this.options.open = true;
@ -203,6 +220,12 @@ $.widget( "ui.selectmenu", {
var self = this,
options = this.options;
if ( options.dropdown ) {
self.newelement
.addClass( 'ui-corner-all' )
.removeClass( 'ui-corner-top' );
}
self.listWrap.removeClass( self.widgetBaseClass + '-open' );
this.options.open = false;