jlmakes / jlmakes/scrollreveal

Add a ScrollReveal().refresh(); method

Open
#565 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
22.5k
Forks
2.2k
PR merge metrics
No merged PRs in 30d

Description

Hello,

When you deal with lazyloaded images you will always have issue with scrollreveal that calculate animation trigger **before** content jump.

There is alreay a solution, it's to call the reveal when the image is loaded, something like that :

```js
const lazyImages = document.querySelectorAll('img[loading="lazy"]');

lazyImages.forEach(function(el) {
el.addEventListener('load', function(e) {
ScrollReveal().reveal('.animate');
});
});
```

The limit of that solution is that you have to specifically call the animation after image have been loaded in order to work. Instead of that, it would be great to be able to call a ScrollReveal().refresh() that would recalculate all the trigger positions of scrollreveal now that content has jumped.

It would work the same way than ScrollReveal().sync() except that sync() method seems to be useful when you add new elements to the dom, not to recalculate position of existing elements.

Best regards,

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.