Bootstrap modal.js + transition.js = conflict?

red_ice

Hey,

We're looking at using a few bootstrap components for a project. I made a page with a standard bootstrap html template, and included bootstrap.js (and then tried min) to start testing out some components that are needed for the build and found that bootstraps Modal doesn't work properly.

The modal worked in ie 7/8(wtf?), but FF, chrome and safari displayed a black screen.

I took apart bootstrap.js and found that the transitions component was causing the modal component to stop working.

Transitions(afaik) is required for the carousel and collapsible boxes components, but we also need to use bootstraps modals.

Has anyone come across this issue before and if so how did you resolve it? We're using bootstrap 2.3.2. I have bootstrap 3 and everything seems to work with that, but I'd rather wait for a stable release before using it.

Cheers

Graham

red_ice wrote: »

We're using bootstrap 2.3.2. I have bootstrap 3 and everything seems to work with that, but I'd rather wait for a stable release before using it.

This following applies to Bootstrap 3 and Bootstrap 2.3.2

For simple transition effects, include bootstrap-transition.js once alongside the other JS files. If you're using the compiled (or minified) bootstrap.js, there is no need to include this—it's already there.

If Bootstrap 3 is working, I'd be tempted to stick with it. At least you know when Firefox 957(or any other browser update) is released, Bootstrap 3 will be updated to accommodate it.

Procasinator

Note that Bootstrap 3 has dropped IE7 support, so if you need that, 3 might not be the best version to use.

Graham

If you need IE7 support, consider trying out bootstrap-ie7:

https://github.com/coliff/bootstrap-ie7

*Preview stats from netmarketshare put IE7 use at about 1.5%, your market may vary.