W3.CSS and Javascript navigation bar Issue

Question

I built a simple website for my business in w3.css from w3schools.com; https:\/\/www.housewashingdelmarva.com\/<\/a>

I believe it's a javascript issue. But I am mostly a front-end CSS and HTML designer. Not sure what I have mistakenly done wrong as I have built two other similar sites that work fine mobile-wise and can't see the difference in the code.

Answer 1

You forgot to add 'demo' id in myFunction during onClick event on Hamburger icon. Click here to see the image where the problem is highlighted.<\/a>

<div class="w3-bar w3-theme-d3 w3-round-xxlarge">
    <a class="w3-bar-item w3-button w3-hover-cyan" href="https://www.housewashingdelmarva.com/">Home</a>
    <a class="w3-bar-item w3-button w3-hover-cyan w3-hide-small" href="#Services">Services</a>
    <a class="w3-bar-item w3-button w3-hover-cyan w3-hide-small" href="#Testimonials">Testimonials</a> 
    <a class="w3-bar-item w3-button w3-hover-cyan w3-hide-small" href="#Gallery">Gallery</a> 
    <a class="w3-bar-item w3-button w3-hover-cyan w3-hide-small" href="#Area-Partners">Our Area Partners</a> 
    <a class="w3-bar-item w3-button w3-hover-cyan w3-hide-small" href="#FAQ">FAQ</a> 
    <a class="w3-bar-item w3-button w3-hover-cyan w3-hide-small" href="#Service-Area">Service Area</a>
    <a class="w3-bar-item w3-button w3-hover-cyan w3-hide-small" href="#About-Us">About Us</a> 
    <a class="w3-bar-item w3-button w3-hover-cyan w3-hide-small" href="#Contact-Us">Contact Us</a>
    <a href="javascript:void(0)" class="w3-bar-item w3-button w3-right w3-hide-large w3-hover-cyan w3-hide-medium" onclick="myFunction('demo')">☰</a>
</div>