Shopify themes, liquid, logos, and UX
Hello,
I am working on the Supply theme and want to have the navigation bar fixed during scrolling down from the PC monitor (from the mobile is working fine).
PS. The previous post did not solve this issue.
Pls assist.
Thank you
Solved! Go to the solution
This is an accepted solution.
Hi @akarl
You can follow this code:
As you have added code of sandip but that's code has issue and i have solved, so add this:
Add this code in Theme.js
$(window).scroll(function(){ var navigationPosition = $('.site-header').outerHeight(); if($(window).scrollTop()>=navigationPosition){ $('body').addClass('sticky-nav'); }else { $('body').removeClass('sticky-nav'); } });
Add in Theme.scss file at bottom
@media only screen and (min-width: 767px) {.sticky-nav nav#navBar {position: fixed;top: 0;bottom: auto;z-index: 5;}}
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024