Touching Toggle not working on Tablet or Mobile

I Need Help
1

Is there anybody out there? I have a Blocs 3 project that works great on all devices on a Desktop, but on Tablet or Mobile the Toggle is not working.

When you get time from a Desktop
Copy (Control C) this armingchampions.com/a2m

Open your Browser and go here. http://responsiv.eu

Paste (Control V) it where it say Enter URL Click “Let’s go”

You can see the website adapting to various devices. Large Flat Screens, Desktop, Laptops, Tablets and Mobile.

What is causing it not to work on Tablet or Mobile?

2

Hello @KBConcepts

I didn’t check it using the Responsiv.eu website, but your site’s Menu toggle is working fine on my smartphone and my tablet, as well as on my desktop.

3

Thanks, @Eldar :slight_smile:
It’s not working on any of my Samsung Galaxy 7’s.

4

I don’t have time to do a deep dive right now, but I see your issue here right away.

It’s hard to notice because it really depends on where the scroll of the page is when you try to click. It’s a by-product of what you’re doing with the sticky navigation and the large logo header section. Your mobile nav gets covered by the section below it at a certain point.

The quick fix is to add a high (ex. z-index: 9999) to the .navbar for mobile.
I say quick because if you could revisit your code you can potentially eliminate the need for this.

Hope this helps.

5

Hey, @Whittfield I appreciate you taking the time out of your day just give me what you did observe. I have to run out and when I get back this will be first on my list. Once I try to figure it out. I’m not a coder, but I’ll see if I can make sense of it.

6

Sorry, @KBConcepts I just assumed because you were able to get the nav behavior that this would be doable. I’ll totally help get you there, I’ve just been running in and out all day.

Try this when you get a chance.

Using the Code Editor in Blocs app, add the following code to the Project - Header. It’s the default choice in the dropdown of the code editor. Just paste in this css snippet:

<style>
.navbar-expand-md {z-index: 9999;}
</style>

That’s it. You should be able to click the menu more dependably. :crossed_fingers:

Let us know how it goes!

7

Very cool of you @Whittfield. :smile:
Your solution worked! Did it work because you move the Toggle to a different location?