Trigger CSS Animation After View Render

API & Custom Code Ask Developers
1

Hi Knacksters,

Can anyone give me some tips for how I can delay CSS animations until after a particular view has rendered?

Many thanks!

2

8947499407

Hi Brad, thank you so much for being so helpful on these forums. On so many occasions I have appreciated the time and effort you take to answer questions and your answers are always easy to understand and well thought out. On behalf of everyone who uses these forums, you deserve a very big collective THANK-YOU!

For this particular problem, I am looking for an event that triggers when a view is finished loading. (As far as I can see, 'knack-view-render' triggers when a view starts loading). Interested to know if anyone has suggestions for this.

 

3

Hi Abhinandan - Javascript handles events, CSS is blind to events.

So on a view render apply the style to the selector you want, something like:

$(document).on('knack-view-render.view_XXX', function(event, view, data) {
    $('.class-of-item-to-style').css('color','red');
})

Learn more about the css function here: https://www.w3schools.com/jquery/jquery_css.asp