Hide top menu and logo, when the scroll reach on particular section.

Hey qhsedirectory,
Thanks for the link to your page, currently you have an error showing at the top of your page above your menu:

/** Add your own functions here. You can also copy some of the theme functions into this file. * WordPress will use those functions instead of the original functions then.*/

this is the text in your child theme functions.php, please try removing any changes that you have made to correct.

As for hiding and showing the header when a specific place on the page is in view, I tested on an example page containing many columns with text blocks, and for one text block I added a custom class waypoint-trigger:

this “trigger” element is down a ways on the page so it is not in view on the page load:

then I added this css in the Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

.waypoint-hide {
  position: fixed !important;
  top: -100px;
  width: 100%;
  z-index: 999;
  opacity: 0;
  background: #fff;
  transition: 0.3s all;
  box-shadow: 0 2px 3px rgba(0,0,0,0.15);
}

.waypoint-show {
  top: 0;
  opacity: 1;
  transition: 0.3s all;
}

and this code in the child theme functions.php file in WordPress ▸ Appearance ▸ Editor:

function custom_waypoint_trigger_script() { ?>
  <script>
window.addEventListener('DOMContentLoaded', function() {
(function($){
  var $header = $('#header_main');
  var $things = $('.waypoint-trigger');
  $things.waypoint(function(direction) {
    if (direction === 'down') {
       $header.addClass('waypoint-hide');
       $header.removeClass('waypoint-show');
    }
    if (direction === 'up') {
       $header.addClass('waypoint-show');
       $header.removeClass('waypoint-hide');
    }
  }, {
    offset: '95%'
  });
})(jQuery);
});
</script>
  <?php
}
add_action('wp_footer', 'custom_waypoint_trigger_script');

Note in the script the “offset” is 95%, this will trigger when the element is just in view, you can adjust to suit, such as 50% for when the element is in the middle of the page.
Please give this a try, I linked to my example page below.

Best regards,
Mike

Hi,
Thank you for the login to your site I believe the issue was that your child theme functions.php was missing the top <?php
I added it back and the script and the css to your child theme stylesheet.
I also adjusted the offset to 10% so the header hides just before the table gets to it.
Please clear your browser cache and check.

Best regards,
Mike

Hi,

Great, I’m glad that Mike could help you out. I’ll close this thread for now then, please open a new thread if you should have any further questions or problems.

Best regards,
Rikard