Auto Shut Mobile Menu When Smooth Scrolling

JavaScript
1

**Note: I Didn’t create this account to sell, or promote anything. I simply want to make my online products run as well as I can.

I’ve spent lots of time wanting to get the mobile menu to auto shut when smooth scrolling. The dropdown menu auto shuts. However, I want the mobile parent menu to also auto shut. The About link is active for testing.
Thanks! :sunglasses:

https://CodePen.io/FavorMan/pen/yyBWOva**

2

can you point what part of the code deals with this behaviour?

3

The mobile toggle code in the HTML is…

<span class="toggle-button animated pulse infinite">&#9776;</span>

The mobile toggle code in the JS is…

const toggleButton = document.querySelector(".toggle-button");
const mainMenu = document.querySelector(".main-menu");
/* Toggle The Menu Icon */
toggleButton.addEventListener('click', function () {
    /* Toggles The Active Class */
    mainMenu.classList.toggle('active');
        if (mainMenu.classList.contains("active")) {              
            /* Adds The Shut (X) Icon */
            toggleButton.innerHTML = "&#215;";
        } else {          
            /* Adds The Hamburger Icon */
            toggleButton.innerHTML = "&#9776;";
        }
});

And I’ve tested scripts like the 2 below.

<script>

document.getElementById(".toggle-button").onclick = function ()
{
  document.getElementById ("check").check = false;
};

</script>
  
<script>
  
$('.toggle-button a').each(function(){
    $(this)slideUp( {
        duration: 300,
        complete: function () {
            $(this).removeClass( 'toggle-button a' );
        }
    });
});
  
</script>
4

This JS that I posted over a day ago looks like a logical solution. I also tested this script with (main-menu), and (menu-item). Possibly this script can be altered a bit. Anybody on here can test this on the Code Pen pen that I have linked to in this thread. :–)

<script>
  
$('.toggle-button a').each(function(){
    $(this)slideUp( {
        duration: 300,
        complete: function () {
            $(this).removeClass( 'toggle-button a' );
        }
    });
});
  
</script>
5

ILM: I’m not sure how else to answer your 1st question about this post. :grinning:

6

You answered good, I don’t know how to help tho

7

Okay, Thanks! Possibly Bootstrap is required to auto close the mobile toggle when smooth scrolling a page. However, I Don’t want to depend on Bootstrap. :upside_down_face:

8

Is there any way to auto close a mobile toggle menu when using one page auto scroll templates, without needing to use Bootstrap? Something tells me that at least one member on here knows my solution! Thanks! :smiling_face_with_sunglasses:

9

Still nobody on here that knows how I can get the mobile toggle to auto shut Without using Bootstrap? At least one JS expert should be able to have a solution! :smiling_face_with_sunglasses:

10

Please stop bumping this. Maybe try stackoverflow instead.