how to display both menu and sub-menu items for mobile

Hi there,

Not sure what you mean? What else is the menu displaying?

You can create a different menu just for mobile and set it to slideout navigation?
https://docs.generatepress.com/article/using-the-wordpress-menu-builder/#setting-a-theme-location

This site is using the same idea.

Let me know.

thanks for your response. i am referring to the menu items and their drop downs (sub-menu items). please have a look at this site http://www.tajforum.com , go to the menu and hover on (Forums), there is a drop down, and this is ok for me on desktop. but i want both the Forum and its drop down to display together on mobile without hovering or clicking for the drop down . thank you

Can you try this code in wp_footer hook?

<script>
    jQuery( document ).ready( function($) {
        if ( $( '.menu-toggle' ).is( ':visible' ) ) {
            $( '.main-navigation' ).addClass( 'sfHover' );
            $( '.main-navigation .sub-menu' ).addClass( 'toggled-on' );
        }
    } );
</script>

GP hooks: https://docs.generatepress.com/article/hooks-overview/

great, it worked. thank you so much for your support.

No problem!