Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #167779

    When resizing the browser window to a smaller browser windows size, my menu begins overlapping into the logo area.
    what can be done (is this a general error that needs fixing in next theme update or ?)….

    http://bit.ly/17e0Vkz

    using latest version enfold

    #167823

    Hi solsikkehaven!

    I added a function in Enfold 2.2 which should fix the issue but in your case it does not kick in. I’m not sure why it doesn’t work but please try to replace the entire code in enfold/js/avia.js with the code from here: https://gist.github.com/InoPlugs/ff21a064c574fc154794 – does it change anything? If not please create me a wordpress admin account and send me the login data to: (Email address hidden if logged out) – I’ll look into it.

    Best regards,
    Peter

    #167880
    This reply has been marked as private.
    #168013

    Hey!

    I fixed it. I had to rewrite my function a bit because it was just intended for the “pull out” mobile menu and not the “dropdown” menu but now / created a separate function which will always check the menu size and resize the paddings of the menu items if necessary.

    Best regards,
    Peter

    #168042

    Thank you – but it’s not working 100%. The logo disappears on smallest sizes – and does not always reappear when sizing up (slowly) again.

    checked with firefox and chrome.

    • This reply was modified 9 months, 3 weeks ago by  solsikkehaven.
    #168058

    Hi!

    Yes, it’s actually a problem with the win.on scroll event which does not always work properly. I replaced it with an interval function which checks the header position on a regular basis and re-size the logo/menu if necessary. Please clear your browser cache and check your website again.

    Best regards,
    Peter

    #168060

    yes, seems to work now.

    I think (personally) that the logo is too small in that hmmmm. 2. level….. (not fully wide, but first time it is smaller, the logo is extremely small in comparison to menu text size etc.) – but in general the responsive part works now 100% :-)

    #168085

    Hello!

    Great, I’ll update the code and include it in the next update.

    If you think the logo is too small you can try to reduce the number of menu items in the first level and add them to a submenu dropdown or you can try to increase the “switch width” which determines when the mobile menu replaces the standard menu links. Open up enfold/js/avia.js and replace

    
        	if(first_level_items > 8 && !bottom_menu)
        	{
        		switchWidth = 989;
        		header.addClass('mobile_menu_tablet');
        	}
    

    with

    
        	if(first_level_items > 7 && !bottom_menu)
        	{
        		switchWidth = 989;
        		header.addClass('mobile_menu_tablet');
        	}
    

    You’re using 8 menu items at the moment this code mod will increase the switch width from 767px to 989px.

    Regards,
    Peter

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

The topic ‘menu items goes into the logo when resizing browser windows’ is closed to new replies.