Можно ли как-то настроить пакет для генерации изображений также для дисплея сетчатки, например @2x?
Или может кто-нибудь дать мне совет, как бороться с сетчаткой?
Спасибо
Можно ли как-то настроить пакет для генерации изображений также для дисплея сетчатки, например @2x?
Или может кто-нибудь дать мне совет, как бороться с сетчаткой?
Спасибо
Согласно этому комментарию автора nahakiole, для этого есть 2 решения:
Вы можете использовать элемент изображения, который обеспечивает синтаксис для объявления нескольких источников изображения. http://w3c.github.io/html/semantics-embedded-content.html#the-picture-element
The other method which we've tried was, if you can guarantee that the image exists, to use a modified version of the retina.js which adds _retina to the filter name and checks if a image with this name exists.
Измененная версия retina.js от nahakiole:
/*-----------------------------------------------------------------------------------*/
/* RETINA.JS
/*-----------------------------------------------------------------------------------*/
(function () {
var regex = /(media\/cache\/filter_[A-Z]+)/i //Added this
function t(e) {
this.path = e;
var t = this.path.split("."),
n = t.slice(0, t.length - 1).join("."),
r = t[t.length - 1];
this.at_2x_path = (n + '.' + r).replace(regex, '$1_retina') //Changed that
}
function n(e) {
this.el = e, this.path = new t(this.el.getAttribute("src"));
var n = this;
this.path.check_2x_variant(function (e) {
e && n.swap()
})
}
var e = typeof exports == "undefined" ? window : exports;
e.RetinaImagePath = t, t.confirmed_paths = [], t.prototype.is_external = function () {
return !!this.path.match(/^https?\:/i) && !this.path.match("//" + document.domain)
}, t.prototype.check_2x_variant = function (e) {
var n, r = this;
if (this.is_external()) return e(!1);
if (this.at_2x_path in t.confirmed_paths) return e(!0);
n = new XMLHttpRequest, n.open("HEAD", this.at_2x_path), n.onreadystatechange = function () {
return n.readyState != 4 ? e(!1) : n.status >= 200 && n.status <= 399 ? (t.confirmed_paths.push(r.at_2x_path), e(!0)) : e(!1)
}, n.send()
}, e.RetinaImage = n, n.prototype.swap = function (e) {
function n() {
t.el.complete ? (t.el.setAttribute("width", t.el.offsetWidth), t.el.setAttribute("height", t.el.offsetHeight), t.el.setAttribute("src", e)) : setTimeout(n, 5)
}
typeof e == "undefined" && (e = this.path.at_2x_path);
var t = this;
n()
}, e.devicePixelRatio > 1 && (window.onload = function () {
var e = document.getElementsByTagName("img"),
t = [],
r, i;
for (r = 0; r < e.length; r++) i = e[r], t.push(new n(i))
})
})();
Uncaught DOMException: Failed to execute 'open' on 'XMLHttpRequest': Invalid URL at XMLHttpRequest.open (http://domain.com:233:7990) at t.check_2x_variant (http://domain.com/js/main_retina_2.js:28:35) at new n (http://domain.com/js/main_retina_2.js:17:19) at e.devicePixelRatio.window.onload (http:/domain.com/js/main_retina_2.js:42:57)
- person ; 17.02.2017