Mobile Nav Menu animation delay and custom code not executing

Hello,

Having 2 issues with my mobile nav menu.

  1. Delay in display (I think due to interaction playing first which has duration 0 to all elements).
  2. Custom Code not triggering on certain pages.

More info.

For #1, when I click the hamburger icon, there’s like a half second wait before the menu actually displays. I think it’s due to the mobile-menu-open interaction I have tied to nav3_menu-button-wrapper but everything in there is delay and duration 0. I reduced the default animation duration from 400ms to 200ms and it helped a little but still a noticeable delay in the animation starting.

For #2 I have some custom code to click nav3_menu-button-wrapper whenever user clicks nav3-background in site-wide footer block. This is so that when a user clicks outside the menu, the menu will close and close icon returns to hamburger icon. The code works fine on this page: https://scholarsitev2.webflow.io/experts but not this one: https://scholarsitev2.webflow.io/

<script>
$('.nav3_background').on('click', function() {
  // set all to 0
  $('.nav3_menu-button-wrapper').click();
});
</script>

I tried moving the code into an HTML embed block but no joy. I checked the class names and didn’t notice any difference in my naming between the two pages that would prevent the custom code from running.

Thanks!
Keegan


Here is my site Read-Only: https://preview.webflow.com/preview/scholarsitev2?utm_medium=preview_link&utm_source=designer&utm_content=scholarsitev2&preview=11374956c12992ee7d8b57a766ea5aac&workflow=preview