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

Incompatable with Bootstrap #284

Open
James2k2 opened this issue Jan 2, 2021 · 5 comments
Open

Incompatable with Bootstrap #284

James2k2 opened this issue Jan 2, 2021 · 5 comments

Comments

@James2k2
Copy link

James2k2 commented Jan 2, 2021

The plugin has an issue whereby the 'modal' class is incompatible with Bootstrap (bootstrap already has a class called modal). a simple rename to something like jq-modal fixes the issue for me. Also, the z-index of the overlay is too low. This should either be customisable as an option, or generally increased. I have fixed these through mods of my own, but for those wanting to just use the basic clean design will run into problems if they use bootstrap or any kind of multi-layered page design.

For those wanting a proper fix whilst maintaining the default style, I guess you could duplicate the default modal CSS and give it a different name, then use modalClass to specify the new name. The only reason I mention this is because Bootstrap is quite popular as a done deal type integration.

@mesuttascic
Copy link

Yes, it is not compatible with bootstrap. I tried with bootstrap@5.0.0-beta2.
I lost 5-6 hours to find that problem. I don't know how to achieve it.
@James2k2 can you share your fixed version?
Maybe you can pull request too.

@ChadHorn
Copy link

In the README, the author states "Naming conflict with Bootstrap: Bootstrap's modal uses the same $.modal namespace. If you want to use jquery-modal with Bootstrap, the simplest solution is to manually modify the name of this plugin."

Hope this guidance helps.

@sumandahal
Copy link

Hey guys, thanks for all the tips. I am not a js expert so unsure where to make the change. Can I do a search for $.modal on the js file and replace that with $.jqmodal, will that fix this?

Thanks

@Friends4U
Copy link

I would like to know 2 :)

@Friends4U
Copy link

In the README, the author states "Naming conflict with Bootstrap: Bootstrap's modal uses the same $.modal namespace. If you want to use jquery-modal with Bootstrap, the simplest solution is to manually modify the name of this plugin."

Hope this guidance helps.

How?

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

5 participants