<header>
<div class="container">
<a class="skip-link" href="#content">Skip to content</a>
<div class="logo">
<a href="index.php"><img src="img/logo.png" alt="Creative Folk"></a>
</div>
<nav>
<button id="toggle-navigation" aria-expanded="false">
<span class="icon-menu"></span><span class="hidden">Menu</span>
</button>
<ul id="menu">
<?php foreach ($navigation as $link) { ?>
<li>
<a href="category.php?id=<?= $link['id'] ?>"
<?= ($section == $link['id'] ) ? 'class="on" aria-current="page"' : '' ?>>
<?= html_escape($link['name']) ?>
</a>
</li>
<?php } ?>
<li><a href="search.php">
<span class="icon-search"></span><span class="search-text">Search</span>
</a></li>
</ul>
</nav>
</div>
</header>
document.body.classList.add('js');
var toggle = document.querySelector('#toggle-navigation');
var menu = document.querySelector('#menu');
var menuItems = document.querySelectorAll('#menu li a');
toggle.addEventListener('click', function(){
if (menu.classList.contains('is-active')) {
this.setAttribute('aria-expanded', 'false');
menu.classList.remove('is-active');
} else {
menu.classList.add('is-active');
this.setAttribute('aria-expanded', 'true');
}
});
'PHP' 카테고리의 다른 글
[p-book] admin category-delete (0) | 2024.06.28 |
---|---|
[p-book] admin category (0) | 2024.06.28 |
[p-book] admin categories (0) | 2024.06.28 |
[p-book] admin index (0) | 2024.06.28 |
[p-book] search (0) | 2024.06.28 |
[p-book] member (0) | 2024.06.28 |
[p-book] article (0) | 2024.06.28 |
[p-book] category (0) | 2024.06.28 |