chrosey/urlaub-friedrichroda
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

[TASK] Navigation auf kleinen Displays

Browse Source 
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
index.html
View File

@ -20,10 +20,12 @@
<div class="navbar-fixed"> <div class="navbar-fixed">
<nav class="light-green lighten-1"> <nav class="light-green lighten-1">
<div class="nav-wrapper container"> <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"> <img src="favicon.png" alt="Visitenkarten-Logo" loading="eager">
</a> </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="#willkommen" title="Gehe zu Abschnitt 'Willkommen'">Willkommen</a></li>
<li><a href="#wohnung" title="Gehe zu Abschnitt 'Ferienwohnung'">Ferienwohnung</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> <li><a href="#buchung" title="Gehe zu Abschnitt 'Buchung und Anreise'">Buchung und Anreise</a></li>
@ -31,6 +33,11 @@
</div> </div>
</nav> </nav>
</div> </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 id="willkommen-banner" class="parallax-container valign-wrapper">
<div class="container"> <div class="container">
<div class="card-panel"> <div class="card-panel">

14
script.js
View File

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