When you open a menu or drop-down list, a backdrop appears on the page, which prevents you from interacting with the rest of the page while the drop-down list or menu is open.

I hid the backs:

.md-select-backdrop, .md-menu-backdrop {width: 0; height: 0; }

.md-scroll-mask {width: 0; height: 0; }

And then if there are triggers. So I can work with the rest of the page content and close the lists and menus.

But md-menu does not want to catch a click on them. Apparently there stopPropagation is worth or something like that.

How to solve this problem? Or maybe there is another approach? Or did I miss something?

function triggerBackdrops() { var backdropSelect = $('.md-select-backdrop'), backdropMenu = $('.md-menu-backdrop'); if (backdropSelect.length || backdropMenu.length) { backdropSelect.trigger('click'); backdropMenu.trigger('click'); } console.log('click'); return true; } $('body').bind('click', function () { triggerBackdrops(); });

0