Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Dynamic content causes height of modal to exceed window height with no scrolling #193

Open
redtopia opened this issue Jul 29, 2022 · 4 comments

Comments

@redtopia
Copy link

After loading content into a jbox modal, the height of the modal stretches below the bottom of the window, and the window cannot be scrolled.

Ideally, I would like to reposition the modal so it is as centered as possible, and if the content exceeds the viewable area, the window can be scrolled to show the bottom of the dialog.

Great work, and thanks for your efforts!

@StephanWagner
Copy link
Owner

jBox repositions automatically if you use the method setContent(), see here: https://jsfiddle.net/StephanWagner/wyxt54g0/

Alternatively you can also use the method position() to reposition jBox, see here: https://jsfiddle.net/StephanWagner/826o9ycg/

jBox does not scroll with the window though, it scrolls within its content area, click the button in the fiddles a couple of times to see what I mean.

@redtopia
Copy link
Author

This helps for sure. I'm now able to reposition the modal when I change the contents. However, in my dialog, I have a div with overflow:auto that does not scroll using the mousewheel. After seeing your fiddles, I'm wondering if perhaps your code is intercepting the mousewheel scroll event? See: https://jsfiddle.net/69dgzvh7/

@StephanWagner
Copy link
Owner

Yes, jBox isolates scrolling to the content area. See the option isolateScroll: https://stephanwagner.me/jBox/options#jbox-content

You can disable it with isolateScroll: false

But the content are of jBox still has overflow: auto

@redtopia
Copy link
Author

Wonderful! Thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants