Anchor error

[ruenel]

Hello @Creativecure,

I have tested your site site both in desktop (smaller browser size) and on my Android phone. The mobile menu closed after you hit the menu items. You may be having some caching issue. I am seeing that you are hosted in SiteGround. Could you please clear your site cache or at least disable the Supercacher in your hosting panel? The SuperCacher is developed by SiteGround exclusively for their customers. It increases the number of hits a site can handle and boosts the website loading speed. The SuperCacher includes 4 different caching options for maximum optimization of your websites. You can access the tool by clicking on the SuperCacher icon in your cPanel.

For more information about this, please check it out here: https://www.siteground.com/tutorials/supercacher/supercacher_intro.htm

And then please clear your browser cache (also in your client’s browser) or at least use the private browsing mode and test the site again.

Hope this helps. Kindly let us know how it goes.

[Creativecure]

Hi @ruenel, thanks for your advice. The menu is closing as I wish, the only thing is that you have to double press the hamburguer button after you pressed the anchored links (“About us”, “Our services” & “Contact”). It is like you have to reactivate the menu after navigate in the One-page links.

I’ll flush the cache.

[ruenel]

Hello @Creativecure,

It could also be because of your JS code is using click(). You must understand that in mobile or touch devices, you do not have any click events. You only have tap, double tap, swipe and pinch. I would highly recommend that you modify your custom JS code and use on() method instead. You can learn more about it from here:

• https://api.jquery.com/on/
• https://www.w3schools.com/jquery/event_on.asp

Using click() method:

jQuery(function($) {
$('.x-navbar .x-nav-wrap .x-nav > li > a').click(function(){
    $('.x-nav-wrap.mobile').toggleClass('in').css('height', 0);
    $('.x-btn-navbar').toggleClass('collapsed');
  });
});

Using on() method:

jQuery(function($) {
  $('.x-navbar .x-nav-wrap .x-nav > li > a').on('click touchstart', function(){
    $('.x-nav-wrap.mobile').toggleClass('in').css('height', 0);
    $('.x-btn-navbar').toggleClass('collapsed');
  });
});

This will make sure that the click event and the touch event will be used in the code.

Hope this explains it briefly.

[Creativecure]

Thanks for the explanation, I’ve changed and it didn’t worked, the links doesn’t work, you press them and they don´t do anything. I deleted the start keeping the ‘click touch’ and worked again, but it has the same problem I had, you have to double clic the hamburger after you navigate on the anchored links.

[friech]

Hi @Creativecure,

The code given serves only as a guide and not to be taken as the optimal solution. Further customization or fixing issues arising from the use of it falls outside the scope of our support, this particular customization is not related to an issue with the theme and instead has to do with your customization of it, you may wish to consult a developer to assist you with this.

Thank you for your understanding.