Mobile Menu - scrolling issue

Support
#1

The mobile menu is really difficult to scroll through. It’s so bad I am certain it will prevent the launch of the site. I’ve been testing with an iPhone 15 Pro running iOS 18.1.

thx

#2

Hello @brocknessmonster,

I have tested it on my iPhone 14 (iOS 18.1) Google Chrome and it seems that the menu is working fine on my end. I would suggest you please purge all the cache of the browser and recheck it

Thanks

#3

@prakash_s thanks for posting that test. Appreciate it.

When I open the menu and scroll down the menu it fights me.

#4

Hey @brocknessmonster,

It seems that you have a custom JS script applied to the site menu:


/* <![CDATA[ */

document.addEventListener("DOMContentLoaded",()=>{
  /* first level icons only */
  jQuery('div.x-dropdown ul > li.menu-item').click((e)=>{
    if (window.innerWidth < 768) {
      let targetEl;
      if (e.target.classList.value.trim() == 'x-anchor-text-primary') {
        // parent
        targetEl = e.target.parentNode.parentNode.querySelector('i.x-anchor-sub-indicator');
      } else if (e.target.classList.value.trim() == 'x-anchor-text') {
        // parent
        targetEl = e.target.parentNode.querySelector('i.x-anchor-sub-indicator');
      }  else if (e.target.classList.value.trim() == 'x-anchor-content') {
        targetEl = e.target.querySelector('i.x-anchor-sub-indicator');
      } else if (e.target.classList.value.trim() == 'x-anchor-sub-indicator') {
        targetEl = e.target;        
      }
      console.log('target el ',targetEl);
      console.log('pre transform val - ',targetEl.style.transform);
      if (targetEl.style.transform == '') {
        targetEl.style.transform = 'rotate(0deg)';
      } else if (targetEl.style.transform == 'rotate(-90deg)') {
        targetEl.style.transform = 'rotate(0deg)';
      } else if (targetEl.style.transform == 'rotate(0deg)') {
        targetEl.style.transform = 'rotate(-90deg)';
      }
      console.log('transform - ',targetEl.style.transform);

    }
  });
  /* nested level icons only */
  jQuery('div.x-dropdown ul li.menu-item ul > li').click((e)=>{
    if (window.innerWidth < 768) {
      let targetEl;
      if (e.target.classList.value.trim() == 'x-anchor-text-primary') {
        // parent
        targetEl = e.target.parentNode.parentNode.querySelector('i.x-anchor-sub-indicator');
      } else if (e.target.classList.value.trim() == 'x-anchor-text') {
        // parent
        targetEl = e.target.parentNode.querySelector('i.x-anchor-sub-indicator');
      }  else if (e.target.classList.value.trim() == 'x-anchor-content') {
        targetEl = e.target.querySelector('i.x-anchor-sub-indicator');
      } else if (e.target.classList.value.trim() == 'x-anchor-sub-indicator') {
        targetEl = e.target;        
      }
      if (targetEl.style.transform == '') {
        targetEl.style.transform = 'rotate(0deg)';
      } else if (targetEl.style.transform == 'rotate(-90deg)') {
        targetEl.style.transform = 'rotate(0deg)';
      } else if (targetEl.style.transform == 'rotate(0deg)') {
        targetEl.style.transform = 'rotate(-90deg)';
      }
      console.log('transform - ',targetEl.style.transform);

    }
  });
});
/* ]]> */

You may need to temporarily remove the code or consult the original source of the JS code.

Be advised that custom JS coding is beyond the scope of our support under our Support Policy. If you are unfamiliar with code and resolving potential conflicts, you may select our One service for further assistance.

Best Regards.

#5

I removed the custom JS and CSS and repeated the experiment. The menu is still pretty buggy. Feels like it’s fighting me. iPhone 15 w iOS

thank you for your help

Edit: when I make the header not Sticky the menu stops fighting me. Maybe I’ll have to accept that?