Sticky navigation with animation in down effect.
Step 1 : Open your "header.phtml" file.
Step 2 : Copy below javascript code and past header.phtml file in bottom.
Step 3 : Copy below CSS and paste in css file.
.fixed-header.page-wrapper .nav-sections{position:fixed;z-index:9;top:0;width:100%;margin-top:0;animation:nav-down .7s;}
@keyframes nav-down {
0%{transform:translateY(-100%)}
100%{transform:translateY(0)}
}
Step 4 : Please clean cache : php bin/magento cache:clean
Now refresh your browser and scroll down.
Info: This example use only in magento project if you want other project use please change class name.
Info: This example use only in magento project if you want other project use please change class name.
