Archived topic
Use sticky header JavaScript for sticky sidebar
7 replies · Started by Stefan on May 18, 2019
Hey there,
I was wondering if it's easy possible to use the script of the sticky header feature to create a sticky sidebar?
Right now I use postiton: sticky; but it only works if I set:
.offside-js--init {
overflow-x: visible;
}I thought it might be a neat solution to just use the already loaded sticky header script.
Is there an easy way to make the script work for my sidebar? Maybe I've to add a class or define something in a extra js file ?
Thanks,
Stefan
Hi there,
the sticky navigation script is designed solely for the navigation bar.
Whats the exact problem when you use position: sticky; - can you share a link to show us the problem?
Hi David,
thanks for your response.
Ok I understand. To get it work I need to set overflow: visible for the .offside-js--init, which only appears when sticky header is enabled. Therefore I'm not quit sure if there are any conflicts/ issues I don't see right now.
The other thing is the missing browser support for older Internet Explorers. A JS solution might work better for them.
The Website is just on a localhost, so no link sorry.
Maybe something like this would work for you?:
https://wordpress.org/plugins/q2w3-fixed-widget/
https://wordpress.org/plugins/sticky-menu-or-anything-on-scroll/
Let me know :)
I'll check it out. Thank you for the recommendation.
What about setting the mentioned .offside-js–init class to overflow: visible. Is there any conflict or problem with that.
Not that I can think of, but that class could possibly change in the future.
Ok I realized that it causes the sticky header to get cut off on mobile.
I better keep it and use another solution.
Thanks for the help anyway.
No problem :)
