You’ve set the element “.widget-area.no-toggle” to be sticky on scroll. That seems to work.
However, the element contains an iFrame (the Facebook banner) that is set to visibility:visible at all times, so it won’t be hidden when it becomes sticky.
I think adding this CSS code should fix the issue:
.original iframe {
visibility:inherit !important;
}
Let me know if that works.
I do see a little delay the moment the element becomes sticky, but I believe that has to do with the fact that there are many other scripts on the page, resulting in a little slower response time.
Hi~
I copy your css code,and past in style.css.
But it dosen’t work.
When I check it, it looks like it’s working for me now. The Facebook banner disappears as well now once the sidebar becomes sticky.
Please note my previous post about the delay. There’s not much I can do about that.
Hi~
I disable other sticky plugin.
Now I have Jetpack,Pagebar2,Share Buttons by AddToAny,Sticky Menu(or Anything!) on Scroll,TinyMCE Advanced,WP-Optimize,Yoast SEO.
The sticky plugin only yours.
But still delay.And I try to search “delay””time””timeout”in my function.php and style.css,I don’t see anything about those word.
I looked into it and it looks like it’s because the widget area has a transition of 0.8 seconds applied to it:
.widget-area {
position: fixed;
background-color: ffffff;
width: 420px;
height: 100%;
padding: 30px;
top: 0;
left: -420px;
-webkit-transition: all 0.8s; /* --- THIS ONE ---*/
transition: all 0.8s; /* --- AND THIS ONE ---*/
overflow-y: auto;
z-index: 0;
}
Because of that, the element will take almost a second to go from visible to invisible, which is why you see the delay. I would recommend to remove that.
Hi~
It’s working!!!
Thank you very much!!!
You saved my life.
Excellent! Happy to help.
