造型Fancybox 2 AJAX

Question

I have 2 files : index.htm and inner.htm

I'd like to load specific div from inner.htm inside index.htm using Fancybox 2. So I decided to use AJAX but the problem is the AJAX inherited parent CSS. I want inner.htm uses its own CSS.

It works perfectly when I use iFrame but with iFrame I can't load specific DIV.

Please see my points below:

with AJAX - I can load specific div from inner.htm - But it uses parent css not its own css

with iFrame - I can't load specific div except the whole inner.htm page - But it uses its own css and not parent css as I expected

Any help would be appreciated! THANKS!

To be clear here, I'm using bootstrap and what I meant to "inner.htm should uses its own css" is it should load its own bootstrap.css so that it would be shrinked to the modal box. What I have now is it's inherited parent's bootstrap.css and not shrinked to the modal box (horizontal scrollbar appears).

So I want inner.htm in modal box to load its col-md-4 not parent's col-md-4. Hope it's clear now. Thanks a lot! :)

Answer 1

add its css to parent css so it will load that one

see your code and add the class which is used by fancybox popup like

ie

.fancybox-iframe .your-div{}

i hope this will work