HTML - When does Bootstrap modal gets load?

Question

I am preparing a website using bootstrap which uses a lots of modals with images. I am concerned about the performance. I want to know that when exactly the browser loads the modal.

With the page loads?
After the page loads?
On click/trigger event?
As per code flow?

Or something else?

Anyone please explain.

If you have images inside your HTML they will be loaded when you visit the page. — max, May 24 '17 at 20:05
@makshh, no they wont, because the parent object has its display property set to none — otoomey, May 24 '17 at 20:18
The answer to that is 'maybe' http://stackoverflow.com/questions/12158540/does-displaynone-prevent-an-image-from-loading — otoomey, May 24 '17 at 21:07
Exactly, `display: none` doesn't mean your image won't be rendered/loaded. — max, May 24 '17 at 21:08

score 0 · Accepted Answer · answered May 24 '17 at 20:13

Yes, the modal is loaded when the page loads. However, bootstrap sets its css display property to none (Line 5876 in the bootstrap.css file). display: none means that the element won't be rendered until its display value changes.

What this means:
You should be fine, unless you plan on showing loads of modals at once. And by loads I mean thousands of them.

HTML - When does Bootstrap modal gets load?

1 Answers1