mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
Reduce blink when switching between image and blurhash
This commit is contained in:
parent
18fe70b978
commit
eb486ef4b7
1 changed files with 17 additions and 5 deletions
|
@ -106,11 +106,23 @@ import './style.scss';
|
|||
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');
|
||||
}
|
||||
elem.addEventListener('transitionend', () => {
|
||||
requestIdleCallback(() => {
|
||||
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');
|
||||
}
|
||||
});
|
||||
// Run the event listener only once after being added
|
||||
}, false);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue