rnosov / react-reveal

Easily add reveal on scroll animations to your React app
https://www.react-reveal.com/
MIT License
2.72k stars 180 forks source link

Safari won't work with fade and several elements #43

Open Nandez89 opened 5 years ago

Nandez89 commented 5 years ago

I have a list of dynamically loaded elements. The first 3 elements load normally but as soon as the list requires to scroll then the animations for the newer elements won't load and opacity remains as 0. This only happens on Safari. Chrome and Firefox work alright. I'm using react-reveal together with react-scroll. But the only way to seem to make it work is to remove react reveal wrapper. On the inspector it looks only like a class="react-reveal" but no style properties are added to the last elements on the list.

Any Ideas on what to look for on how to fix this?

sagge commented 5 years ago

Facing the same issue. Style properties remain absent until the web page is scrolled even though the page doesn't contain scrollable content. After scrolling, style properties are added and the wrapped element becomes visible. The problem seems to be related to child element having overflow-y and overflow-x properties as the non-working element will start to work after removing those properties.

Emibob commented 5 years ago

+1