$(document).ready(function () {
var imgixOptions = {
updateOnResizeDown : true,
updateOnPinchZoom : true,
fitImgTagToContainerWidth: true,
fitImgTagToContainerHeight: true,
autoInsertCSSBestPractices: true,
pixelStep : 5
};
imgix.onready(function() {
imgix.fluid(imgixOptions);
});
});
This works as expected on dom ready however some pieces of my site load dynamically using AJAX.
How can I trigger the imgix-js library to load the images the way it does on dom ready?
You'll need to call
imgix.fluid
on the new content after the AJAX load completes, passing in the parent node of the new content to limit the scope of the new.fluid
call. Something like this:I totally recognize that this isn't very intuitive at the moment--you've already called
imgix.fluid()
at the document level earlier, so marking these new images as fluid independently doesn't smell quite right. We're aware of this limitation and will figure out a way to make this work better in a future version of the library. If you've got specific ideas on how you think this behavior should be handled, you should email me at [email protected] and I'd be happy to discuss!