[TASK] Navigation auf kleinen Displays

fixes #6
This commit is contained in:
Christian Seyfferth 2020-04-22 22:21:43 +02:00
parent 4314fd4214
commit 7dc3232ce4
2 changed files with 19 additions and 6 deletions

View File

@ -20,10 +20,12 @@
<div class="navbar-fixed">
<nav class="light-green lighten-1">
<div class="nav-wrapper container">
<a href="/" id="logo-container" class="brand-logo left" title="Gehe zur Startseite">
<a href="/" id="logo-container" class="brand-logo" title="Gehe zur Startseite">
<img src="favicon.png" alt="Visitenkarten-Logo" loading="eager">
</a>
<ul class="right hide-on-small-and-down">
<a href="#" data-target="sidenav" class="sidenav-trigger hide-on-large-and-up"><i
class="material-icons">menu</i></a>
<ul class="right hide-on-med-and-down">
<li><a href="#willkommen" title="Gehe zu Abschnitt 'Willkommen'">Willkommen</a></li>
<li><a href="#wohnung" title="Gehe zu Abschnitt 'Ferienwohnung'">Ferienwohnung</a></li>
<li><a href="#buchung" title="Gehe zu Abschnitt 'Buchung und Anreise'">Buchung und Anreise</a></li>
@ -31,6 +33,11 @@
</div>
</nav>
</div>
<ul id="sidenav" class="sidenav">
<li><a href="#willkommen" title="Gehe zu Abschnitt 'Willkommen'">Willkommen</a></li>
<li><a href="#wohnung" title="Gehe zu Abschnitt 'Ferienwohnung'">Ferienwohnung</a></li>
<li><a href="#buchung" title="Gehe zu Abschnitt 'Buchung und Anreise'">Buchung und Anreise</a></li>
</ul>
<div id="willkommen-banner" class="parallax-container valign-wrapper">
<div class="container">
<div class="card-panel">

View File

@ -9,6 +9,9 @@ document.addEventListener('DOMContentLoaded', function () {
interval: 5000
});
var elems = document.querySelectorAll('.sidenav');
var sidenav = M.Sidenav.init(elems, {});
var mailcypts = document.querySelectorAll(".cryptmail");
for (var i = 0; i < mailcypts.length; i++) {
mailcypts[i].onclick = function () {
@ -19,12 +22,15 @@ document.addEventListener('DOMContentLoaded', function () {
var hashAnchors = document.querySelectorAll("a[href^='#']");
for (var i = 0; i < hashAnchors.length; i++) {
if (hashAnchors[i].getAttribute("href") != "#") {
hashAnchors[i].onclick = function () {
var target = this.getAttribute("href");
scrollToElement(target);
return false;
}
}
}
});
const navbarScrollOffset = -48;