When is the polyfill executed? How to refresh?

[codeofsumit]

I'm building a new framework with the mobile-first, progressive enhancement approach.

Mobile-first means I need to use workarounds for media-queries and for convenience and maintenance, I chose respond.js. I think your polyfill is executing earlier than respond.js, which makes background-images cover the "mobile version" of the elements. Once respond.js hits, most elements are enlarged.

So in order for this polyfill and respond.js working nicely together I need to either load the polyfill after respond.js hits, or I need to refresh the polyfill calculations after respond.js is executed.

Any advice on that one is very much appreciated.

And great work, btw! ;-)

[codeofsumit]

resizing the browser window will update the calculations to correctly enlarge the image. Is there any way to force a polyfill-refresh via JS? I could imagine to trigger the browsers resize event (via jQuery for example) but I don't know if the polyfill listens to that event. EDIT: triggering the resize event doesn't seem to work

[codeofsumit]

OK, this may be irrelevant. I just tested on a XP machine and everything is fine there. Seems like IE11 in IE8-mode is the problem.

[fotisp]

I am having this issue in IE 8 on Win 7, it requires a slight resize of the browser for the images to appear