Hello ,
I would like to do scrolling effect with navbar that it will be minimized on scroll and expand on top
I know how to do it with css and js , do you have some tutorial how to with bss
Thanks
Yep, if you know how to do it with CSS and JS, create the files and import them into BSS and design your nav. Doubtful there will be a tutorial on doing something like that as it’s not part of any basic nav setup.
Create your nav the same as you would normally, then apply your CSS and JS as you normally would. It’s not quite as efficient as editing the HTML to do it, but once you get the hang of it it’s pretty slick. Once you’re done you can create a Library Component that you can reuse over and over and not have to redo it all from scratch again.
1 Like
As jo-r said, if you know the CSS and JS, just import your stylesheets and javascript and assign the classes to the navbar through the attributes panel.
I have a dedicated folder with a variety of short js scripts that I selectively import when I start building a new site. Fade on scroll, hide on scroll, add-remove classes on scroll, grow/shrink the brand logo on scroll, fade dropdown menus in and out, and even a script that does a soft change in height for the Bootstrap carousel when I use it for testimonials. If I can find the time, I will post them in the tips and tricks section.
2 Likes