WordPress.org

Make WordPress Core

Opened 3 years ago

Closed 3 years ago

#21832 closed defect (bug) (fixed)

Weird CSS with a large submenu item in admin

Reported by: ericlewis Owned by: azaozz
Milestone: 3.5 Priority: normal
Severity: normal Version: 3.5
Component: Menus Keywords: has-patch
Focuses: Cc:

Description

With a large menu (tons of submenu pages) positioned at the bottom of the menu bar in the admin, there is some unexpected CSS behavior.

While on a submenu page (or the top-level menu page), on hover of the menu will move the submenu actually up over some of the rest of the menu items. (See screenshot)

I've traced it to a hover bind function on menus, which doesn't check if the current submenu is already opened before adjusting its CSS. If the menu is already open, it should just be left alone.

To reproduce, drop this code in.

add_action('admin_menu', 'register_custom_menu_page');

function register_custom_menu_page() {
	add_menu_page('custom menu title', 'custom menu', 'add_users', 'custompage', 'custom_page_callback', '', 101); 
	for ( $i = 0; $i <= 15; $i++ )
		add_submenu_page( 'custompage', 'My Custom Submenu Page ' . $i, 'My Custom Submenu Page ' . $i, 'manage_options', 'my-custom-submenu-page-' . $i, 'custom_page_callback' ); 	
}

function custom_page_callback() {
	echo '<h3>My Custom Page</h3>';

}

Attachments (2)

21832.patch (484 bytes) - added by ericlewis 3 years ago.
basic fix: if has class wp-menu-open don't modify CSS on hover
on-hover-of-big-submenu-fail.png (136.1 KB) - added by ericlewis 3 years ago.
screenshot of the issue

Download all attachments as: .zip

Change History (8)

@ericlewis3 years ago

basic fix: if has class wp-menu-open don't modify CSS on hover

@ericlewis3 years ago

screenshot of the issue

comment:1 @alexvorn23 years ago

you must use a different function for every add_submenu_page

comment:2 follow-up: @alexvorn23 years ago

can't replicate in chrome, maybe your browser version is old?

comment:3 in reply to: ↑ 2 @ericlewis3 years ago

Replying to alexvorn2:

can't replicate in chrome, maybe your browser version is old?

Double checked. Found it in Chrome 21.0.1180.89, Safari 6, however it doesn't show up in FireFox 15.0.1

comment:4 @azaozz3 years ago

Confirmed, but applying the patch prevents shoving the submenu when the menu is folded.

Version 0, edited 3 years ago by azaozz (next)

comment:5 @azaozz3 years ago

  • Milestone changed from Awaiting Review to 3.5

comment:6 @azaozz3 years ago

  • Owner set to azaozz
  • Resolution set to fixed
  • Status changed from new to closed

In [21787]:

Don't try to show the submenu when it's visible (Chrome), part props ericlewis, fixes #21832

Note: See TracTickets for help on using tickets.