menu don't break on Android

Home Forums Latest release 1.1.x menu don't break on Android

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #8336
    ben.f
    Participant

    I download the last version of smartmenus(1.1.0). In my header I include ‘jquery.smartmenus.js’ (Jquery as well). My HTML menu looks like this:

    <nav id="main-nav">
    	<!-- Mobile menu toggle button (hamburger/x icon) -->
    	<input id="main-menu-state" type="checkbox" />
    	<label class="main-menu-btn" for="main-menu-state">
    		<span class="main-menu-btn-icon"></span> Toggle main menu visibility
    	</label>
    	<h3 class="nav-brand"><a href="#">NAME</a></h3>
    	<ul id="main-menu" class="sm sm-mint">...</ul>
    </nav>

    and I had this script :

    // SmartMenus init
    $(function() {
      $('#main-menu').smartmenus({
        subMenusSubOffsetX: 6,
        subMenusSubOffsetY: -8
      });
    });
    
    // SmartMenus mobile menu toggle button
    $(function() {
      var $mainMenuState = $('#main-menu-state');
      if ($mainMenuState.length) {
        // animate mobile menu
        $mainMenuState.change(function(e) {
          var $menu = $('#main-menu');
          if (this.checked) {
            $menu.hide().slideDown(250, function() { $menu.css('display', ''); });
          } else {
            $menu.show().slideUp(250, function() { $menu.css('display', ''); });
          }
        });
        // hide mobile menu beforeunload
        $(window).bind('beforeunload unload', function() {
          if ($mainMenuState[0].checked) {
            $mainMenuState[0].click();
          }
        });
      }
    });

    Everything is working fine on desktop( when I resize the browser the menu break properly) but on on my mobile (Android 7.0) the menu doesn’t break, it still display desktop menu. What am I doing wrong? How can I have smartmenus break on mobile?

    #8338
    admin
    Keymaster

    Have you included a viewport meta tag in the <head> section of your pages? Something like this:

    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    If yes and it’s still not working, then please post some kind of demo URL since it’s not easy to guess what might be wrong without checking your exact code.

    #8339
    ben.f
    Participant

    Thank you, it works fine now.

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.

Register

You will be emailed a link to set your password.

Login

Lost password?