function openNav() { var showNav = ` #CandleID{ opacity: 0; pointer-events: none; } #uberuns{ pointer-events: auto; opacity: 1; } #abmelden{ pointer-events: auto; opacity: 1; } #buecher{ pointer-events: auto; opacity: 1; } #meinebuecher{ pointer-events: auto; opacity: 1; } #nav-toggle { opacity: 1; pointer-events: auto; } .suchleiste{ opacity: 1; pointer-events: auto; } #buttonID{ opacity: 1; pointer-events: auto; } .suchleiste{ position: fixed; right: 280px; top: 0px; } #buttonID{ position: fixed; right: 240px; top: 0px; } #uberuns{ position: fixed; left: 43%; top: 96px; width: 120px; height: 35px; background-color:#664220 ; color:rgb(255, 255, 255); } #abmelden{ position: fixed; left: 0px; top: 150px; width: 120px; height: 35px; background-color:#664220 ; color:rgb(255, 255, 255); } #buecher{ position: fixed; left: 43%; top: 43px; width: 120px; height: 35px; background-color:#664220 ; color:rgb(255, 255, 255); padding-right:10px; padding-left: 8px; padding-top: 15px; padding-bottom: 0px; text-align: center; text-decoration: none; } #meinebuecher{ position: fixed; left: 43%; top: 149px; width: 120px; height: 35px; background-color:#664220 ; color:rgb(255, 255, 255); padding-right:10px; padding-left: 8px; padding-top: 15px; padding-bottom: 0px; text-align: center; text-decoration: none; } `; var closeNav = `#CandleID{ opacity: 1; pointer-events: auto; } `; if (document.getElementById('nav-toggle').checked) { var styleSheet = document.createElement("style") styleSheet.innerText = showNav document.head.appendChild(styleSheet) } else { var link = document.createElement('link'); // set the attributes for link element link.rel = 'stylesheet'; link.type = 'text/css'; link.href = 'style.css'; // Get HTML head element to append // link element to it document.getElementsByTagName('HEAD')[0].appendChild(link); var styleSheet = document.createElement("style") styleSheet.innerText = closeNav document.head.appendChild(styleSheet) } } function unset() { var link = document.createElement('link'); var head = document.getElementsByTagName('head')[0]; // set the attributes for link element link.rel = 'stylesheet'; link.type = 'text/css'; link.href = 'style.css'; link.media = 'all'; // Get HTML head element to append // link element to it //document.getElementsByTagName('head').appendChild(link); head.appendChild(link); var styleSheet = document.createElement("style") styleSheet.innerText = closeNav document.head.appendChild(styleSheet) }