strues / retinajs

JavaScript, SCSS, Sass, Less, and Stylus helpers for rendering high-resolution image variants
http://retinajs.com
MIT License
4.42k stars 610 forks source link

Not possible to apply retinajs() to new images #249

Closed IlyaSemenov closed 8 years ago

IlyaSemenov commented 8 years ago

It is not possible to cleanly apply retinajs() to new images (that have been dynamically inserted with javascript after window.load).

The module only exports a single function retinajs() without any parameter, which iterates over all images and tries to fetch the @2x image. For images that have been already processed by previous rethinkjs() call, it dumbly tries @2x@2x images.

It's either that rethinkjs() must mark previously processes images and ignore them on future runs, and/or accept optional parameter images (which could be element, NodeList or array of image elements to process).

IlyaSemenov commented 8 years ago

Monkey patch

This temporarily overcomes the problem (uses jquery):

<script src="/static/bower/retina.js/dist/retina.min.js"></script>
<script>
    // Monkey patch to allow retinajs run twice
    // See https://github.com/imulus/retinajs/issues/249
    (retinajs = (function(retinajs) {
        return function() {
            retinajs();
            $("[data-rjs]").removeAttr("data-rjs");
        };
    })(retinajs))();
</script>
jgnewman commented 8 years ago

Ah, great catch! We'll fix this one.

jgnewman commented 8 years ago

Solved in 2.1.0