How to handle transitionend on new row?
How to handle transitionend on new row?
coffeefedora
Posts: 2Questions: 1Answers: 0
I am attempting to use a CSS transition effect with new rows.
What I do is start a transition for the background, and when transitionend is fired, I reverse it, and then clean up the css used.
This works fine everywhere but in Datatables. the transition will start, but the end is never triggered. I feel like this happens because of some internal DOM manipulation which interrupts the browser. Either moving the element, or some sort of clone operation which generates a new "non-transitioning" row.
How can I detect new rows added and render the transition when they are visible? rowCallback doesn't seem to be the right place. the drawCallback fires multiple times, so I am unable to know when is the "last" draw.
This discussion has been closed.
Answers
i was actually able to get it working with the draw callback. I'll have to see what's going on in my code, but I think I am seeing 2 or 3 draw events fire, which is the root issue.
https://jsfiddle.net/oug56hen/1/
working fiddle.