jaicab/Paraxify.js

Glitch on paraxified header image

Opened this issue · 3 comments

TeChn4K commented

Hi,
Great plugin, tiny and easy !

So, I have some glitch at first scroll when I set paraxify on a header image.
This is like the plugin didn't position paraxified image at page init.

Does someone have ever seen this issue ?

TeChn4K commented

Another way to reproduce :

  • Apply paraxify on some image
  • Scroll to see the image
  • Refresh/F5 tab

If your browser don't replace you at top of page, scroll and you will see the glitch.

willtate commented

I'm also seeing this when applying paraxify to an image at the top of a page.

edit: I tried to fix this in my fork of Paraxify here: https://github.com/willtate/Paraxify.js

It seems to be working...at least in my implementation.

pitangaweb commented

I think it's because Paraxify launches before the image is loaded. I was able to fix it by using imagesLoaded

Then I added this to my code in order to re-trigger Paraxify once the image is loaded:

$('.myImageContainer').imagesLoaded( function() {
    myParaxify = paraxify('.paraxify');
});