Mobile Menu Animation

[Paul]

Hi guys, I’m wanting to design a mobile menu hamburger and menu fly out with animation, and dissolve characteristics as per this site here: https://www.getintheloop.com.au/

Is this possible with GeneratePress?

[Tom]

Hi there,

This is actually a pretty complex thing to do (the toggle animation).

This topic should help you get started: https://generatepress.com/forums/topic/spinning-hamburger/#post-976278

Let me know 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Paul]

Thanks Tom

Took a look at this and it’s a bit much for me to look at without a developer. Can I ask another query on the same issue that’s maybe a simpler request?

I’ve got a standard GeneratePress mobile menu working (see screen grab – https://ibb.co/PGbyRYm) – is it possible to move the ‘X’ Close icon to the right of panel? So basically it sits in the same position as the original hamburger icon – so user doesn’t need to move finger to open/close menu.

Plus make it larger in size?

Many thanks

[Tom]

Give this CSS a shot:

.slideout-navigation button.slideout-exit {
    text-align: right;
    font-size: 20px;
}

Let me know 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Paul]

Brilliant – thanks Tom!

[Tom]

No problem 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts