Javascript 如何在命令上应用imgix js？

这在dom ready上可以正常工作，但是我的一些站点使用AJAX动态加载

---

如何触发imgix js库以其在dom ready上的方式加载图像？

在AJAX加载完成后，需要对新内容调用

imgix.fluid

，传入新内容的父节点以限制新

.fluid

调用的范围。大概是这样的：

$(document).ready(function () {
    var imgixOptions = {
        updateOnResizeDown : true,
        updateOnPinchZoom : true,
        fitImgTagToContainerWidth: true,
        fitImgTagToContainerHeight: true,
        autoInsertCSSBestPractices: true,
        pixelStep : 5
    };

    imgix.onready(function() {
        imgix.fluid(imgixOptions);
    });
});

/* imgix parameters */
var watermarkParams = {
      w: 320,
      h: 320,
      fit: 'crop',
      q: 90,
      auto: 'format',
      mark: '/imgix-logo-web.png',
      markalign: 'center,middle',
      markw: 160,
      markalpha: 80,
      markpad: 20
};

/* Construct imgix URL */
var watermarkImage = new imgix.URL('https://assets.imgix.net/examples/mountain.jpg');
watermarkImage.setParams(watermarkParams);
watermarkImage.attachImageTo('#image-example');

---

我完全认识到目前这不是很直观——您之前已经在文档级别调用了

imgix.fluid（）

，因此将这些新图像单独标记为流体并不是很正确。我们意识到这一局限性，并将在该库的未来版本中找到一种使其工作得更好的方法。如果你对如何处理这种行为有具体的想法，你应该发电子邮件给我jason@imgix.com我很乐意讨论

我没有投米格尔的反对票，但我不确定这对我目前的问题有何影响。你是说每次我需要重新运行imgix js优化器时，我都需要对所有图像运行

attachImageTo

？

// Store the target that your async content is being inserted into
var $target = $('#target');

// Make your AJAX request
$target.load('new_content.html', function () {
  var imgixOptions = {
    updateOnResizeDown : true,
    updateOnPinchZoom : true,
    fitImgTagToContainerWidth: true,
    fitImgTagToContainerHeight: true,
    autoInsertCSSBestPractices: true,
    pixelStep : 5
  };

  // Call imgix.fluid, passing the target as the rootnode.
  // Note that imgix.fluid expects the rootnode to be an HTMLElement
  // rather than a jQuery collection, so call .get(0) on $target
  imgix.fluid($target.get(0), imgixOptions);
});