Header Menu Issues - Inconsistent Performance

Support
#1

Hey there, Thanks for your help with this. The header on mobile acts strangely.

  1. On Mobile, my home page, the first link (with a submenu) won’t drop down.
    https://croxley.com/
    It looks like there is something floating above it. I’ve tried making the z-index super high but that doesn’t help.

  2. On Desktop, on one of my “location” pages, the Locations menu item with submenu (different menu than problem 1) doesn’t drop down when you hover over it - https://croxley.com/brooklyn/
    I did hide the Reservation link from the menu here, but when I un-hide it via css, the same issue happens.

It works fine here though (same menu) https://croxley.com/franklin-square/

Thanks so much
Mike

#2

Hi Mike,

The first issue is weird and I can’t something on the frontend except for this error.

VM2619:1 Uncaught TypeError: a.toLowerCase is not a function

You could try testing for a plugin conflict first. You can do this by deactivating all third party plugins, and seeing if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.

For the issue on this page:https://croxley.com/brooklyn/, please inspect BAR > make sure that Content Scrolling is set to OFF.
Let us know how it goes!

#3

Hi Lely, thanks for your help.

  1. not seeing this error.
    I disabled all plugins and the error persists.

  2. i made sure the Content Scrolling is Off on the bar.
    It is working fine on https://croxley.com/franklin-square/ , but not on https://croxley.com/brooklyn/

What are the next steps?

Thanks,
Mike

#4

Hi there,

Another support here, and I can’t reproduce the issue on my end. I’m able to click the first link in the sub-menu. What mobile and browser you’re testing it on? If you’re on iPhone, then maybe it’s due to touch events blocking. Please add this code to your global custom javascript.

jQuery(document).ready( function($) {

function no_touch() {
setTimeout( function(){ $('a[href*="#"]').off('touchstart touchend'); }, 300 );
}

$(window).load( no_touch );
no_touch();

} );

2), The drop-down works here https://croxley.com/brooklyn/ on my end, perhaps it’s just your browser cache? Please clear them before testing it,

Thanks!

#5

Hey,

Thanks for your help on this. I ended up changing the section beneath the nav, and that helped with the way the nav worked. I was doing some absolute positioning and z-index changes so that messed with it. All good now

Thanks again!
Mike

#6

Glad all is sorted now.

Cheers!