Bulma: any way to make navbar-dropdown work in mobile like in desktop ?

[NurdinDev]

I need to keep the navbar-dropdown in mobile.

Any option for this?

[jgthms]

It’s not possible because it uses the hover state. But try using a regular drodpwon instead, within a navbar item!

[rebosante]

No javascript workaround, just place this in your mobile media query (It's SASS but you can turn it to css easily)
`
.navbar-item {

    &.has-dropdown {
      .navbar-dropdown {
        display: none;
      }
      &.is-active {
        .navbar-dropdown {
          display: block;
        }
       }
     }
  }

`

[akarca]

Adding both css and javascript. navbar-dropdown works on mobile

.navbar-item {

    &.has-dropdown {
      .navbar-dropdown {
        display: none;
      }
      &.is-active {
        .navbar-dropdown {
          display: block;
        }
       }
     }
  }

$(".navbar-item.has-dropdown").click(function(e) {
      if ($(".navbar-burger").is(':visible')) {
        $(this).toggleClass("is-active");
      }
  });
  $(".navbar-item > .navbar-link").click(function(e) {
      if ($(".navbar-burger").is(':visible')) {
        e.preventDefault();
      }
  });
  $(window).resize(function(e) {
    if (!$(".navbar-burger").is(':visible') && $(".navbar-item.has-dropdown.is-active").length) {
      $(".navbar-item.has-dropdown.is-active").removeClass('is-active');
    }
  });