search

HiDeoo / intro.js-react

Intro.js react wrapper
MIT License
395 stars 58 forks source link

scrollToElement doesn't works as expected - page elements are not visible. #85

Closed Dreamerset closed 1 year ago

Dreamerset commented 2 years ago

Need hints/ideas/help in resolving the issue below.

It doesn't seems as expected behavior and I haven't found yet any none intro.js workaround/hack.

Problem: When next intro step scrolls the page to the corresponding element, the scrolled part of the page is not visible although the element is selected and the step description is presented.

Web browser: Chrome Version 102.0.5005.63 (Official Build) (64-bit)
OS: Windows 10 Pro
intro.js-react version: 0.6.0
intro,js configuration:
<Steps enabled={stepsEnabled} steps={steps} initialStep={0} onExit={() => setStepsEnabled(false)} options={{ hidePrev: true, disableInteraction: false, exitOnOverlayClick: true, showStepNumbers: false, scrollToElement: true, overlayOpacity: .6, showBullets: true, showButtons: true, nextToDone: true, exitOnEsc: true, showProgress: false, keyboardNavigation: true, prevLabel: "Back", nextLabel: "Next", doneLabel: "Done", }} /> step8 step9

HiDeoo commented 1 year ago

I cannot manage to find a repro of the issue, here is a CodeSandbox example with a tour including a scroll.

Maybe it's related to your specific layout / CSS as the intro.js repo contains various issues regarding scroll issues.

If you're still having this issue, feel free to re-open with a small repro example.