Topic on Skin talk:Chameleon

Dropdown Menu behavior on "Clean.xml" Layout

2
Revansx (talkcontribs)

I'm using the "Clean" layout (./layouts/clean.xml) which provides a very nice system of dropdown menus for all the sections of the Mediawiki:Sidedar, but the default behavior is that the menus "stay open" until you either click on an option or click away somewhere else and I'd prefer that they vanish as soon as you navigate away from them. Does anyone have any hints about what I should grep for in the skin folder to change the default behavior?

Morne Alberts (talkcontribs)

Since this is an intentional design decision in Bootstrap, overriding this behavior might be slightly difficult.

Here is a crude solution that closes the dropdown (and dropup) the moment you leave either the trigger link or the menu itself. This is not forgiving, so the moment you go 1 pixel over the edge it closes immediately. Because of this you also need to remove some margins, otherwise you "leave" the dropdown before you even reach the menu.

MediaWiki:Chameleon.js

$( '.dropdown, .dropup' ).on( 'mouseleave', function( e ) {
    $( '[data-toggle="dropdown"]', this ).dropdown( 'hide' );
});

MediaWiki:Chameleon.css

.dropdown .dropdown-menu {
    margin-top: 0;
}
.dropup .dropdown-menu {
    margin-bottom: 0;
}
Reply to "Dropdown Menu behavior on "Clean.xml" Layout"