Hey guys, I use the Bricks Extras Modal for a popup contact form.
If I enable BF Smooth “Scroll Smoother” it breaks my fixed header and the Modal. If I enable “Adjust all fixed elements automatically” it fixes the header, but the Modal shows immediately and cannot be closed.
I have tried the Modal widget in both the Header and the Footer. Is there an easy way to move the Modal outside the “smooth-wrapper”, or put the “smooth-wrapper” on “” ??
OK, I got it working.
When “Scroll Smoother” is enabled it wraps Main and Footer.
I manually added “data-brf-fixed” to the Modal Widget and move the widget to the Header.
I could not access “brx-header” from the UI, so I used the filter ‘bricks/header/attributes’ to add it.
Now have a smooth scroll with a fixed header and the popup working properly.
Amazing! 
Hey Daniele,
I got some feedback on the YT video saying that it is not good for accessibility. There was no explanation of the reason though. Searching Google, I could not find any that would support that argument.
However, looking at what “data-brf-fixed” does; it pulls the elements out and adds them back at the bottom of the DOM. So now the “header” is at the bottom of the code, which affects the keyboard tab navigation.
Would it be possible for your code to detect if “data-brf-fixed” is on a header element or wraps a header element, and put it at the top of the DOM instead of the end?
Hello Danielle, did you see my last response?
Also, would it be possible to detect Android OS or IOS and disable the smooth scroll? Because these devices have their own smooth scrolling, it looks really jumpy on them.
Hi @alan,
in general, Any DOM manipulation that removes elements from their original, meaningful location and places them elsewhere can have accessibility drawbacks. If we focus on accessibility, it makes more sense to choose Lenis as the scroll smoothing provider instead of GSAP.
Lenis also has very good scrolling behavior, but without the disadvantages of GSAP ScrollSmoother regarding fixed positioned elements. With lenis, no DOM manipulation is needed.
By the way, you can see an overview of the differences here:
Regarding your second question: Out of the box, you only can enable or disable it for mobile devices in general. But surely you could add a custom script to detect the OS of your device and stop the Scroll Smoother to load.
Hope that this helps you 
