Tagged: , ,

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #212748

    Hey,

    I’m trying to find out how to make the mobile menu appear when the site is viewed in a portrait orientation on a tablet – I’ve had a quick search but a lot of the questions/answers regarding this seem to be tailored towards individual issues.

    As it stands, I get the full menu at 1024px which is perfect, and the mobile menu on a smartphone – I just need to make the switch from the full desktop menu to the mobile version on tablet/portait – how can I change this?

    Thanks

    #212749
    This reply has been marked as private.
    #212926

    Hey!

    Please refer to this post to change the width to switch to mobile menu https://kriesi.at/support/topic/navigationlogo-affected-on-ipad-and-androidsamsung/#post-202024

    Best regards,
    Yigit

    #215801

    Hey,

    I’ve edited avia.js to reflect the fact I want the mobile menu at 990px, then I’ve added the following code to hide the main menu up to 990px:

    @media only screen and (max-width: 990px) {
    .responsive #header .main_menu ul {
    display: none;
    }
    }
    

    I’ve also included this CSS:

    @media only screen and (max-width: 767px){
    .mobile_active #advanced_menu_toggle {
    display: block;
    }
    }
    

    I’m now left with a range from 768px – 990px where there is no menu at all – Is there anything else that needs to be done make the mobile menu visible?

    • This reply was modified 5 years, 10 months ago by  Iano999.
    #215990

    Hi!

    You do not need to add custom CSS code to remove main menu. When you make changes on Avia.js file, you are setting the width to change the switch from main menu to mobile menu, so when you increase it to, say, 1000, on screens smaller than 1000px, mobile menu will be displayed.

    Best regards,
    Yigit

    #220862
    This reply has been marked as private.
    #220884

    Hey!

    Please add following code to Quick CSS in Enfold theme options under Styling tab

    @media only screen and (max-width: 989px) { 
    .mobile_active #advanced_menu_toggle {
    display: block;
    }}

    Cheers!
    Yigit

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.