Start a new discussion

To start a new discussion please visit the discussions section of the GitHub home page of the project.

Discussions on GitHub

You can also search our old self-hosted forums for any useful information below but please note that posting new content here is not possible any more.

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
  • #8336

    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
    	<h3 class="nav-brand"><a href="#">NAME</a></h3>
    	<ul id="main-menu" class="sm sm-mint">...</ul>

    and I had this script :

    // SmartMenus init
    $(function() {
        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 {
            $, function() { $menu.css('display', ''); });
        // hide mobile menu beforeunload
        $(window).bind('beforeunload unload', function() {
          if ($mainMenuState[0].checked) {

    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?


    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.


    Thank you, it works fine now.

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘1.1.x’ is closed to new topics and replies.