Добрый день!
Сделал бургер меню Bulma по официальной документации.
В браузере все прекрасно работает, а на телефоне (iPhone 4s) оно вообще не отображается. Кликаешь на открытие, в браузере открывается, а на телефоне ничего не происходит.
Вот код.
<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">
Пункт 1
</a>
<a class="navbar-item">
Пункт 2
</a>
<a class="navbar-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>
Стили стандартные.
В чем проблема?