Hi there,
I can’t seem to add fadeIn effect to my page with Amazon book image links. I tried the following method:
Custom CSS:
.hideme {
opacity: 0;
}
Custom Javascript:
$(document).ready(function() {
/* Every time the window is scrolled … */
$(window).scroll( function(){
/* Check the location of each desired element */
$(‘.hideme’).each( function(i){
var bottom_of_object = $(this).offset().top + $(this).outerHeight();
var bottom_of_window = $(window).scrollTop() + $(window).height();
/* If the object is completely visible in the window, fade it it */
if( bottom_of_window > bottom_of_object ){
$(this).animate({‘opacity’:’1′},500);
}
});
});
});
Any help would be greatly appreciated !
Hello,
The theme offers a fade in effect for it’s big grid elements from the lazyload animation as can be seen on our demo here: http://demo.tagdiv.com/newspaper/ if you want to implement another type of fade effect you can use css: http://stackoverflow.com/questions/11679567/using-css-for-fade-in-effect-on-page-load
or a javascript code the one you suggested. Unfortunately we did not test any of this on amazon book images and i’m not sure how they are implemented. In any case, this is a custom job and it falls beyond what support can offer you. If you cannot adapt the code to your case, you will probably want to hire a freelancer to help out.
Thank you!
