Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

The event 'load' is not called for lazy image loading. #18

Open
RanaMuhammadIrshad opened this issue Jul 6, 2023 · 0 comments
Open

Comments

@RanaMuhammadIrshad
Copy link

RanaMuhammadIrshad commented Jul 6, 2023

Magento version:

2.4.5-p3

Edition (EE, CE, OS, etc):

EE

Expected behavior:

On category pages, when we scroll, the images should lazy load.

Actual behavior:

On scroll, the images are not lazy loading on mobile version.

Steps to reproduce:

One can activate the the module 'Catalog Lazy Load' and set the 'Skip amount' to like 2. This will load the first 2 images and rest would be loaded on scroll.

.one("load", function() {
                            var original = $self.attr("data-" + settings.data_attribute);
                            $self.hide();
                            if ($self.is("img")) {
                                $self.attr("src", original);
                            } else {
                                $self.css("background-image", "url('" + original + "')");
                            }

I need help to solve the image lazy loading problem that I face in our project. Actually, the 'load' event seems to be never called as we did debugging. So I tried to research a bit, why this event might not be triggered. I did find a post on Stack Overflow that says that 'load' event is a property of window neither document nor body and that one should use window instead. Alternatively, it is suggested to use 'DOMContentLoaded' event instead of 'load'. This actually does not solve my problem. Would it be an idea to adapt that accordingly?
Or could someone think of a reason, why this might happen?
The Stack Overflow page is as follows:

https://stackoverflow.com/questions/58730444/why-load-event-not-working-on-addeventlistener

MDN Web Docs is also suggesting to use 'DOMContentLoaded' compare to 'load' event. More is here please:

https://developer.mozilla.org/en-US/docs/Web/API/Document/DOMContentLoaded_event

Preconditions

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant