To get the behavior at the Tiki project sites in which the Top module zone scrolls upward out of site and the Topbar module zone sticks to the browser top edge, a custom module containing JavaScript is put in the Bottom module zone.
The custom module is called "Hide Fixed Top Nav Bar on Scroll (0.2)" (this can be any name, of course), and the module is given the 'nobox="y"' parameter. Here is the content/data of that custom module:
Copy to clipboard
{jq}{literal} $(document).ready(function () { var resetCSS = { transition: 'all .5s ease 0s', top: '', height: '', minHeight: '', opacity: '', overflow: '' }; $(window).on("scroll", function () { if ($(window).scrollTop() > 10) { $('.navbar-fixed-top').css({ transition: 'all .75s ease 0s', top: '-20px', height: '25px', minHeight: '5px', opacity: '.75', overflow: 'hidden' }); $('html:not(#page_1) .topbar_wrapper').css({ position: 'fixed', top: '7px', width: '100%', left: 0, 'z-index': 3 }); $("html:not(#page_1) .topbar").css({ "box-shadow": "0 5px 10px 0px rgba(0,0,0,.25)" }); } else { $('.navbar-fixed-top').css(resetCSS); $(".topbar_wrapper").removeAttr('style'); $(".topbar").removeAttr('style'); } }); $('.navbar-fixed-top').on('mouseover', function () { $(this).css(resetCSS); $('html:not(#page_1) .topbar_wrapper').css({ top: '48px' }); }); }); {/literal}{/jq}
The pixel distances can be adjusted as necessary.