0

I am working on this site

http://futureclassicsfashion.co.uk/wordpress/collection/season/aw14-moving/

The site uses the masonry script and I have found freezeframe.js

http://freezeframe.chrisantonellis.com/documentation/#examples

which pauses my GIFS until hovered on, which is great but it doesn't work with Masonry. If I turn off the masonry it works perfectly but I need to keep the masonry layout. With the masonry script all GIFS disappear until hovered on. Any help would be really appreciated!

lsloss
  • 45
  • 8

1 Answers1

0

You have not assigned or added the freezeframe class to the images.

For each image you need to either add freezeframe in the class of the image or you can assign a specific class.

<img class="freezeframe" src="whatever.gif" />

Also noticed you had infinitescroll. If you really want to do something with that as well you would have to use its example to have it run with infinitescroll

$('#main').infinitescroll({
  class_name: "freezeframe"
},function(elements){
  freezeframe.run();
});

Since all your images use "alignnone" as a class name you can try and use that instead of freezeframe in the example above as the class_name.

Robert Lee
  • 1,541
  • 1
  • 10
  • 20
  • Thanks Robert. I've actually had to take off the freezeframe class whilst my client viewed the page but it didn't work when the freezeframe class was applied. Also infinite scroll is not used on the specific page. I'm considering a jpg replace img to be used instead and swapping it with javascript. I think this will reduce loading times too. Really appreciate you taking the time to have a look though. – lsloss Apr 09 '14 at 17:06