To clarify, it's important to note that CSS transitions/animations can function independently from JavaScript event listeners like transitionend
. Although JS can still play a role in triggering these animations, they are not strictly necessary for their implementation.
However, utilizing transitionend
events can be beneficial when you want to synchronize JavaScript actions with CSS transitions, allowing for smoother interactions on your webpage.
For example, checking if an element has a transition set using:
$('div').css('transitionDuration') !== '0s'
can help guide your scripting decisions.
A QUICK DEMO showcasing this functionality is available based on your jsfiddle.
In the case of the "slider thing," simply swapping images with JS can work effectively even without smooth transitions, though adding CSS transitions can enhance the user experience. Omitting transitions may impact functionality less than neglecting other essential CSS properties like position, width, height, and opacity.
In my opinion, the availability of events/listeners related to CSS transitions/animations does not render them obsolete. Comparing this to deeming CSS pseudo elements redundant because additional HTML elements can serve the same purpose overlooks the benefit of maintaining separation between content, styling, and logic layers based on individual preferences and specific project requirements.