AbanteCart Development > Customization help

Hello admin how i can make top bar

(1/1)

sultanali:
Hello admin,

My Question is, how i can we make "Sticky" Header bar in the default template (the blue bar that has logo and other links), when i scroll down, it will move along.
just like the new abantecart website.
 
i try to make the header div " position fixed " then whole page messed up, position sticky doesn't work.
it seems like the header bar is not grouped in a main single div, as it consist's of 3 to 4 div and i think this is the reason i can't able to give it fixed position or make it sticky.

in the default temp, there is a div " <div class="container-fluid"> "
and the new ac website it has " <div class="rt-header-inner"> " but can't get any clue ... how to do that.

Need help
Thanks

abantecart:
See if this will help you:
https://www.w3schools.com/howto/howto_js_navbar_sticky.asp

You can use "headerstrip" class for the div that contains the header.

Sam_78:
If you want your navbar to stay on-top always then modify the following line:
/storefront/view/default/template/common/header.tpl line#2 <div class="headerstrip navbar navbar-inverse" role="navigation"> to <div class="headerstrip navbar navbar-inverse navbar-fixed-top" role="navigation">

Navigation

[0] Message Index