Hide Submenu Element on Mobile

Hi,
Sorry for the late reply, I have taken a look at your “giving” page on both desktop and mobile. The fullwidth sub-menu is not designed to be sticky for mobile, that’s why it’s disabled by default. There have been modifications to try to achieve this and is why you are getting the jumping and it is breaking away from the “sticky_placeholder” the “blue area”.
I tried recreating your page and found that without modifications the sub-menu can stick to the top with this javascript at the end of your functions.php file in Appearance > Editor:

function custom_script(){
  ?>
  <script>
(function($){
$(document).ready(function(){       
   var scroll_start = 0;
   var startchange = $('#sub_menu1');
   var offset = startchange.offset();
    if (startchange.length){
   $(document).scroll(function() { 
      scroll_start = $(this).scrollTop();
      if(scroll_start > offset.top) {
        document.getElementById('sub_menu1').classList.add('sticky-top');
       } else {
        document.getElementById('sub_menu1').classList.remove('sticky-top');
       }
   });
    }
});
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'custom_script');

and this css:

.sticky-top {
    position:fixed!important;
    top:0!important;
    z-index:10000!important;
}

please see the screencast in the Private Content area.
I’m not sure where the modifications are on your site, but if you can remove them then this should work for you on Enfold v4.7.3
It looks like you are using v4.5.7, so that could be another factor.

Best regards,
Mike

Hi,
We will leave this open while you look into this. A couple of places to look would be if your child theme has a /shortcodes/menu/ folder in it, you could rename to something else via FTP as a test, “/menu-old/”
and if your custom css has any reference to “sticky_placeholder” or “sub_menu1”, you could comment out to test.
Also check your child theme functions.php.

Best regards,
Mike

Hi Tami,

Thanks for the kind feedback, I have passed it on to Mike :-)

Best regards,
Rikard

Hi,
There are some cases where editing files in WordPress > Appearance > Editor returns an error where it says “please use FTP” This is a safety tool, and in such case please use FTP.

Best regards,
Mike

Hi,
To hide the sub-menu on mobile please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:

@media only screen and (max-width: 767px) { 
	#sub_menu1 {
		display:none !important;
	}
}

After applying the css, please clear your browser cache and check.

Best regards,
Mike

Hi,
I see that you are using Enfold v4.4.1, please update to v4.7.6.3

Best regards,
Mike