Mobile Menu not clickable / working

Hey Themeco Team,
I have a problem with my mobile menu. It opens correct but when i tap or click on a menu nothing happens. I updated all plugins and cleared all caches and purged the CDN. In the chrome dev tools I get this on a click Uncaught TypeError: Cannot read properties of undefined (reading 'length') at init.s.fx.s.Tween.run (jquery-migrate.min.js:2) at u (jquery.min.js:2) at Function.S.fx.tick (jquery.min.js:2) at ot (jquery.min.js:2)

Can you help me with this issue?
Thanks, best Benjamin

Hi Benjamin,

Thank you for writing in, but I cant access your site, In the meantime, please do the following:

  • Ensure that you are fully up to date. WordPress, Theme, and Cornerstone (Version Compatibility)

  • Clear all the site caches (plugin, server-side, CDN, and browser’s cache) so that the code from the latest release is always in use. This will help you to avoid any potential errors. While you’re at it, please deactivate this caching feature while we tackle this issue.

  • Test for a plugin conflict. 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.

Cheers!

Thanks for the report. I fixed the cloudflare setting.
All the other bulletpoints I tried so far. Nothing helped. :frowning:

Hi @Benjamin1983,

I tried to deactivate all your plugins except cornerstone and the mobile menu is working. That being said, there’s a plugin conflict on your website. I suggest that you deactivate all your plugins except cornerstone and activate it one by one to find the culprit.

Hope that helps.

Did you activate the device toolbar in chrome dev tools?
When I deactivate all plugins except Cornerstone and shrink the window until the mobile menu appears, it is working fine. But as soon as I activate the device toolbar and “tap” instead of click the menu or I try it on my mobile the error above happens and it is not working.

Hello @Benjamin1983,

It might be the issue of plugin conflict as my colleague @marc_a suggested. I went ahead and checked your site(On my iPhone 7 plus) it seems that the mobile menu is working fine at my end. It seems that you have already fixed the issue.

If the issue still persists at your end please let us know.

Thanks

Did you try to click on the menu entries? The menu opens nicely on my end but tapping on the entries does nothing.
I tried it on a Samsung Galaxy S7 (Brave), iPhone 8 (Safari) and Linux and Windows (Brave)

Hello @Benjamin1983,

You are having this issue because you have added this custom JS code:

jQuery(document).ready(function($) {
	$('.ilightbox-holder').addClass('new-lightbox-container');
});

jQuery(document).ready(function($) {
   var subMenuLink = $('.x-navbar .mobile .x-nav li.menu-item-has-children > a');

   subMenuLink.click(function(e) {
     e.preventDefault();
     $(this).siblings('.sub-menu').slideToggle(300);
   });
});






jQuery( function($) {

$('.x-nav-wrap.mobile #menu-menu-1 .sub-menu a').off('click touchstart touchend');
$('.x-nav-wrap.mobile #menu-menu-1 .sub-menu a').on('click', function( e ){

e.preventDefault();

$('html,body').stop();

$('.x-btn-navbar').trigger('click');

var target =  $(this);

setTimeout( function() {
$('html,body').stop().animate({
      scrollTop: $('#' + target.attr('href').split("#").slice(-1)[0] ).offset().top
    },700 ,'swing');

}, 200 );

} );

 } );






jQuery(document).ready(function($) {
    
  $('a[href*="#"]').not('a[href*="#"].x-slider-scroll-bottom').off('touchend touchstart click');
  
  var $body                = $('body');
  var bodyHeight           = $body.outerHeight();
  var adminbarHeight       = $('#wpadminbar').outerHeight();
  var navbarFixedTopHeight = $('.x-navbar-fixed-top-active .x-navbar').outerHeight();
  var locHref              = location.href;
  var locHashIndex         = locHref.indexOf('#');
  var locHash              = locHref.substr(locHashIndex);

  var dragging             = false;

  $body.on('touchmove', function(){
    dragging = true;
  });

  //
  // Calculate the offset height for various elements and remove it from
  // the element's top offset so that fixed elements don't cover it up.
  //

  function animateOffset( element, ms, easing ) {
    $('html, body').animate({
      scrollTop: $(element).offset().top - adminbarHeight - navbarFixedTopHeight + 1
    }, ms, easing);
  }

  //
  // Page load offset (if necessary).
  //

  $(window).load(function() {
    if ( locHashIndex !== -1 && $(locHash).length ) {
      animateOffset(locHash, 1, 'linear');
    }
  });

  //
  // Scroll trigger.
  //

  $('a[href*="#"]').on('touchend click', function(e) {
    $href            = $(this).attr('href');
    notComments      = $href.indexOf('#comments') === -1;
    notAccordion     = $href.indexOf('#collapse-') === -1;
    notTabbedContent = $href.indexOf('#tab-') === -1;
    if ( $href !== '#' && notComments && notAccordion && notTabbedContent ) {
      var theId = $href.split('#').pop();
      var $el   = $('#' + theId);
      if ( $el.length > 0 ) {
        e.preventDefault();

        if (dragging) {
          return;
        }

        animateOffset($el, 850, 'easeInOutExpo');
      }
    }
  });

  //
  // Initialize scrollspy.
  //

  if ( $body.hasClass('x-one-page-navigation-active') ) {

    $body.scrollspy({
      target : '.x-nav-wrap.desktop',
      offset : adminbarHeight + navbarFixedTopHeight
    });

    //
    // Refresh scrollspy as needed.
    //

    $(window).resize(function() {
      $body.scrollspy('refresh');
    });

    var timesRun = 0;
    var interval = setInterval(function() {
      timesRun += 1;
      var newBodyHeight = $body.outerHeight();
      if ( newBodyHeight !== bodyHeight ) {
        $body.scrollspy('refresh');
      }
      if ( timesRun === 10 ) {
        clearInterval(interval);
      }
    }, 500);

  }

  $body.on("touchstart", function(){
    dragging = false;
  });

  $('.x-btn-navbar').click(function(e) {
    e.preventDefault();
  });

});

Please remove the code or at least double-check your custom JS code because that is where the conflict is coming from. Be advised that custom coding is beyond the scope of our support. You may need to contact the person who added that code or a 3rd party-developer to repair the code.

Thank you for your understanding.

Thank you so much for pointing me in the right direction. Your support is incredible!!! Thanks again!

HI @Benjamin1983,

You’re welcome! If you have any other concerns or clarifications regarding our theme features, feel free to open up a new thread.

Thank you.