Created by: lookfirst
This is a wip on an absolute based modal which I think is a much better long term solution to developing a modal for bootstrap.
This fixes a lot of issues with the existing modals for people who want to have more control over how they are displayed. Some benefits of an absolute based modal:
- You have more control over stacking. In other words, if you need to open up a modal within a modal, the z-indexing works better. This is because I pull the modal (and background) out of the dom and shove it at the top of the body (and even put it back when it is hidden).
- It is possible to fix the background scrolling issue.
- With the window.scroll handler, it is possible to center the modal in the window when it is resized.
- I disliked the scrolling within the modal. I'd rather that the whole window scrolls. This also makes long modals possible.
- It is possible to set a data-top attribute on the modal and specify that you want the modal to start off X pixels from the stop of the window instead of centered.
- The css is simpler imho.
There is a couple issues with my implementation that I'd like some comments/help on.
- The fade effect isn't working 100%. When you first open the modal, the slide down effect doesn't work that well. If you close the modal and re-open it (without refreshing the page), it works better. I'm sure this is just a timing issue of where I'm setting the top of the modal, but I haven't been able to figure it out yet.
- The responsive stuff isn't working as well as I'd like and in fact, I just deleted it. I don't need my modals to be super responsive and I'm not quite sure how all that stuff should work.
- For people who do want the scrolling within the modal, we need to find a way to add that back again.
Consider this a WIP. I'm not even sure if @fat will like this at all. I'd like constructive feedback and suggestions for improvement.
references issues: #3353 (closed), #4379, #3361 (closed), #3217 (closed), #407 (closed)