I have placed joyride in my main parent component and it is working really well so far except for this one hangup.
Some tabs have too much content, and as such we have an inner div (common across all pages) that will sometimes scroll.
In these situations, when there are steps that require scrolling, it won't scroll. Instead, the step box just shows up at the bottom of the page. This is likely because it is treating the window as the full page, since Joyride is not being rendered in that local component, it has no way of knowing it needs to scroll down since that main outer div is just set to 100vh.
Any idea how to overcome this obstacle?
Hey @MichaelA59
Which version are you using?
@gilbarbara
Version 1.11.2
Autoscroll doesn't work in V1.
Try v2 and let me know if it doesn't work.
npm i react-joyride@next
Thanks I'll look into that!
@MichaelA59
I've update the README with the new setup and documentation.
There's a Migration from 1.x document to help with the transition. If you find any new information that could be helpful to add to it, let me know
Thanks man. I actually ended up sticking with V1 for simplicity and time's sake. Also, to do the scrolling, I just had a callback get triggered for a specific step which ran an autoscroll in the window which solved my issue. Thanks for the help!
@gilbarbara I tried using v2 and am having issues with inner/child containers scrolling horizontally to their targets. See the forked demo below, on the scroll demo tab:
https://codesandbox.io/s/34lq26p2rp
Thanks for this library and for your help!
@xveganxxxedgex
hey, I don't plan to implement horizontal scroll, since this is too edge case.
Feel free to open a PR.
Vertical scrolling still isn't working in 2.0.5 with an overflow div (and without). I've set scrollToSteps={true} in the Joyride component but it still doesn't seem to want to scroll all of the way down... Any suggestions?
+1
Any update?
Most helpful comment
Vertical scrolling still isn't working in
2.0.5with an overflow div (and without). I've setscrollToSteps={true}in the Joyride component but it still doesn't seem to want to scroll all of the way down... Any suggestions?