I’ve been trying to make a horizontal slider that works as follows…
1) User clicks on menu item
2) Sub-menu slides out to the right.
3) When the user clicks on the menu item again, the menu slides back.
As you can see, if you click on ‘Services’, the entire menu is pushed down before bouncing back up on completion of the slide-out process.
I want it to be smooth so that it all the text is on one line.
I’ve tried it with mouseover and mouseout events and i solved the bouncing issue with setting same height to .flyout and nav li…changing display: inline-block; to float: right; on .flyout doesn’t work in my case…