Why doesn't the Burger menu Bulma on the phone?

Good day!

Did Burger menu Bulma in the official documentation.

In the browser everything works fine, but on my phone (iPhone 4s) it does not appear at all. Click on open, the browser opens, but nothing happens.

Here is the code.
<a role="button" class="navbar-burger" data-target="navMenu" aria-label="menu" aria-expanded="false">
 <span aria-hidden="true"></span>
 <span aria-hidden="true"></span>
 <span aria-hidden="true"></span>
</a>

<div class="navbar-menu" id="navMenu">

 <a class="navbar-item">
 Item 1
</a>

 <a class="navbar-item">
 Item 2
</a>

 <a class="navbar-item">
 Item 2
</a>
</div>


<script type="text/javascript">
 document.addEventListener('DOMContentLoaded', () => {

 // Get all "navbar-burger" elements
 const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);

 // Check if there are any navbar burgers
 if ($navbarBurgers.length > 0) {

 // Add a click event on each of them
 $navbarBurgers.forEach(el => {
 el.addEventListener('click', () => {

 // Get the target from the "data-target" attribute
 const target = el.dataset.target;
 const $target = document.getElementById(target);

 // Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
el.classList.toggle('is-active');
$target.classList.toggle('is-active');

});
});
}

});
</script>


Styles standard.

What's the problem?
March 12th 20 at 08:05
0 answer

Find more questions by tags User's navigationHTMLJavaScriptCSS