mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
fix(card): white flashing images
This commit is contained in:
parent
f9333b7848
commit
a91d4b6a67
1 changed files with 16 additions and 4 deletions
|
@ -87,9 +87,6 @@ import './style.css';
|
||||||
requestAnimationFrame(() => {
|
requestAnimationFrame(() => {
|
||||||
if (elem.tagName !== 'IMG') {
|
if (elem.tagName !== 'IMG') {
|
||||||
elem.style.backgroundImage = "url('" + url + "')";
|
elem.style.backgroundImage = "url('" + url + "')";
|
||||||
if (elem.classList.contains('blurhashed')) {
|
|
||||||
elem.style.backgroundColor = '#fff';
|
|
||||||
}
|
|
||||||
} else {
|
} else {
|
||||||
elem.setAttribute('src', url);
|
elem.setAttribute('src', url);
|
||||||
}
|
}
|
||||||
|
@ -101,6 +98,12 @@ import './style.css';
|
||||||
} else {
|
} else {
|
||||||
elem.classList.add('lazy-image-fadein');
|
elem.classList.add('lazy-image-fadein');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const canvas = elem.previousSibling;
|
||||||
|
if (elem.classList.contains('blurhashed') && canvas && canvas.tagName === 'CANVAS') {
|
||||||
|
canvas.classList.remove('lazy-image-fadein-fast', 'lazy-image-fadein');
|
||||||
|
canvas.classList.add('lazy-hidden');
|
||||||
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -111,7 +114,6 @@ import './style.css';
|
||||||
if (elem.tagName !== 'IMG') {
|
if (elem.tagName !== 'IMG') {
|
||||||
url = elem.style.backgroundImage.slice(4, -1).replace(/"/g, '');
|
url = elem.style.backgroundImage.slice(4, -1).replace(/"/g, '');
|
||||||
elem.style.backgroundImage = 'none';
|
elem.style.backgroundImage = 'none';
|
||||||
elem.style.backgroundColor = null;
|
|
||||||
} else {
|
} else {
|
||||||
url = elem.getAttribute('src');
|
url = elem.getAttribute('src');
|
||||||
elem.setAttribute('src', '');
|
elem.setAttribute('src', '');
|
||||||
|
@ -120,6 +122,16 @@ import './style.css';
|
||||||
|
|
||||||
elem.classList.remove('lazy-image-fadein-fast', 'lazy-image-fadein');
|
elem.classList.remove('lazy-image-fadein-fast', 'lazy-image-fadein');
|
||||||
elem.classList.add('lazy-hidden');
|
elem.classList.add('lazy-hidden');
|
||||||
|
|
||||||
|
const canvas = elem.previousSibling;
|
||||||
|
if (canvas && canvas.tagName === 'CANVAS') {
|
||||||
|
canvas.classList.remove('lazy-hidden');
|
||||||
|
if (userSettings.enableFastFadein()) {
|
||||||
|
canvas.classList.add('lazy-image-fadein-fast');
|
||||||
|
} else {
|
||||||
|
canvas.classList.add('lazy-image-fadein');
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export function lazyChildren(elem) {
|
export function lazyChildren(elem) {
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue