javascript - Fixed Navbar sub dropdown won't display correctly -
i've created custom navigation bar i've decided make responsive because of mobile trend nowadays.
however when creating sub-dropdown menu in fixed
nav bar, messes (wont show correctly) , aside page wont scroll down show sub navigation items.
here jsfiddle: http://jsfiddle.net/7j6ckx0g/
i've tried changing position
of navbar static
, , fixes second issue want navbar fixed.
thanks :)
1st add function
function sybnavtop(){ var rowheight = $('.row').outerheight(); $('#nav-visible').css('top',rowheight); }
this function height of row class div detrmine top list , call in window resize , call in document load
$(window).on('resize',function(){ sybnavtop(); });
in media screen make in #nav-visible
position: fixed; overflow-y: auto !important; overflow-x: hidden !important; bottom:0; #nav-visible { border-top: 2px solid #e0e0e0; border-bottom: 2px solid #e0e0e0; display: none; visibility: hidden; text-align: center; z-index: 3; position: fixed; background: white; width: 100%; left: 0; padding: 10px 0; overflow-y: auto !important; overflow-x: hidden !important; bottom:0; }
note : code let know how reach goal .. may need @media screen , (max-width : 400px) use list in right way
Comments
Post a Comment