add_action('wp_footer', 'custom_hide_header_script'); function custom_hide_header_script() { ?> <script type="text/javascript"> (function() { var prevScrollpos = window.pageYOffset; window.onscroll = function() { var currentScrollPos = window.pageYOffset; if (prevScrollpos > currentScrollPos) { document.getElementById("scrolling-header").style.top = "0"; } else { document.getElementById("scrolling-header").style.top = "-100px"; } prevScrollpos = currentScrollPos; } })(); </script> <?php } ?>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter