I was wondering if there is any demo/provision in the theme where I can add Animate on scroll down in canvas?
Something like this? - https://www.delac.io/wow/
I see we have all the animate .js files present, but couldn't find the onScroll code.
3 replies · opened Dec 25, 2019
I was wondering if there is any demo/provision in the theme where I can add Animate on scroll down in canvas?
Something like this? - https://www.delac.io/wow/
I see we have all the animate .js files present, but couldn't find the onScroll code.
Hello,
This Feature is already included with Canvas: http://themes.semicolonweb.com/html/canvas/animations.html . You can simply use the codes from the animations.html Template. Also, consider the Documentation > Shortcodes > Animations Section for complete setup instructions.
Hope this Helps!
Let us know if we can help you with anything else or if you find any further issues.
Can I also scroll back to the top (after going down through the entire website) and then down to let the animations run again - without a reload.
I am actually looking for an onScroll event that is fired on an element every time and not only once.
Hello,
This is not included by default but you can consider using the following JS code at the bottom of your HTML page after the js/functions.js JS Linking:
jQuery(window).on( 'scroll', function(){
if( window.scrollY == 0 ) {
jQuery('[data-animate]').each( function(){
var element = $(this),
animation = element.attr('data-animate');
element.removeClass( 'animated ' + animation ).addClass('not-animated');
});
SEMICOLON.widget.animations();
}
});
This will definitely work fine but we do not recommend using this since this is not good for UX.
Hope this Helps!
Let us know if we can help you with anything else or if you find any further issues.
Have the same question, or something new?
Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.
Reply on the dashboard