I have to "copy" this website [login to view URL] which is built in Wordpress, white I'm build it using Angular Material 1 + php.
the issue is that <md-menu-bar> and <md-menu> don't work correctly on hover (to open and to close)
for ex. (as you can see on the demo below in the link) you can't open a <md-menu> inside a <md-menu-bar> without click the first ( but then works), also menu doesn't always close if you hover outside of the menu (see the video I've made).
[login to view URL]
I tried to insert this md-menu in my project, but I had to use css instead of md-menu, so I need to fix this issue.
this project has to work in :
Osx : Safari, Chrome, Firefox and Opera
Windows 7 / 8.1 / 10 : Safari, Chrome, Firefox and Opera, Explorer and Edge.
iOS from iPhone 4S iOS 8.0
(right now it works with all of them)
I need it to be fixed in my project (one [login to view URL] page), with no external libraries apart Angular JS 1.
Also I want a Demo outside that page, of a <md-menu-bar> and one of <md-menu>.
<md-menu-content>'s width has to be at least the width of its <md-menu>
I need 2 css for opening and closing the menu so I can modify the effect (for ex fade in, fade out, or zoom, etc..)
this has to work on hover on desktop and width ng-click on mobile.