TF-2160 Use loading attribute replace IntersectionObserver

(cherry picked from commit 88362cab421f0962dc0103bd165d70850668043e)
This commit is contained in:
dab246
2023-09-26 15:31:10 +07:00
committed by Dat H. Pham
parent be7eada7b7
commit 73de2f37fa
3 changed files with 1 additions and 38 deletions
@@ -61,40 +61,6 @@ class HtmlUtils {
}
''';
static const scriptLazyLoadImage = '''
<script type="text/javascript">
const lazyImages = document.querySelectorAll("img.lazy-loading");
const options = {
root: null, // Use the viewport as the root
rootMargin: "0px",
threshold: 0 // Specify the threshold for intersection
};
const handleIntersection = (entries, observer) => {
entries.forEach((entry) => {
if (entry.isIntersecting) {
const img = entry.target;
const src = img.getAttribute("data-src");
// Replace the placeholder with the actual image source
img.src = src;
img.removeAttribute("data-src");
// Stop observing the image
observer.unobserve(img);
}
});
};
const observer = new IntersectionObserver(handleIntersection, options);
lazyImages.forEach((image) => {
observer.observe(image);
});
</script>
''';
static String customCssStyleHtmlEditor({TextDirection direction = TextDirection.ltr}) {
if (PlatformInfo.isWeb) {
return '''