hunzaboy / light-modal

A new lightweight, powerful and easy to use CSS Modal.

Hi, I am Aslam 👋

On github i create awesome stuff to make my life and others easy. I love playing and working with CSS. I like contributing to opensource too.

Other ✨✨✨✨

• Currenlty working on Codedmails
• If you like giving Kudos, checkout 🥁 Online Kudos Creator - share love and appreciation 💌💌💌
• Checkout cool stuff i built on Codepen 🖊️🖊️🖊️
• Read some of my articles on DEV ✍🏾✍🏾✍🏾
• Co-authored a book on Bulma.io 📗📗📗
• Helping community on Stackoverflow 🤝🤝🤝

light-modal's Issues

Close button

Closing the modal (with corner close icon) scrolls me back to the top of the page... any suggestion why this happens?

can js open dlg？

Trigger via javascript

Is there any chance to show modal when page loads?
I've tried to create hidden a tag with .trigger('click'); on $( document ).ready() but it didn't work.

Gallery mode

hi there,
I need to replace my iziModal component and this is the best adept. There's missing me one thing - gallery mode that makes possible to switching between modals without close them.
Is possible to implement this feature please?

Jump to top after closing.

Hi, awesome job man.
I really like how this works, but got one issue.

After opening modal for example in the middle of the page, closing it cause jump to top.
Is there any way to change this behaviour?

Of course everything is set exactly like in demo, i'm just playing with this.

Scrolling to top behavior

Hi! I have a scroll-to-top when I click the both close buttons, when the modal is closed, the browser window goes to the top.

How can prevent this behavior, I already tried to use the "fixed" attribute in the body, and the preventdefault with JS.

Thanks

Accessibility

Nice work,

But for the record this kind of work lacks all the accessibilty features provided by common modal scripts.
And without JS it will never be able to have all the mandatory features to pass any accessibilty validation (WCAG, section 508, ...) .

I think this should be emphasized on the "Readme/how to use" to avoid this kind of "proof of concept" project to go live on any website where it could prevent real users from accessing important content.

Remove scrollbar

How to remove scrollbar from modal? I tried:

.light-modal {
    overflow:hidden;
}
.light-modal-body {
    overflow-y: auto;
    overflow:auto;
}

Which browsers are supported?

Please add browser support