Web animation using CSS and JavaScript | Linux Today

Web animation using CSS and JavaScript

Written By
O
Opensource.com
Sep 27, 2016

With CSS, we use animation, transition, and transform properties as parameters. When using animation property, the keyframe property must be used to divide the animation into small pieces. Then we apply necessary transition or transform properties to each piece.

With JavaScript and jQuery, we use the animate() function and apply transformation and transition properties. Other functions are available in jQuery, which we can use directly: they are fadein(), fadeout(), slidedown(), slideup(), as well as the show() and hide() function for adding little delay, which will help to achieve animation.

O

Opensource.com

Linux Today Logo

LinuxToday is a trusted, contributor-driven news resource supporting all types of Linux users. Our thriving international community engages with us through social media and frequent content contributions aimed at solving problems ranging from personal computing to enterprise-level IT operations. LinuxToday serves as a home for a community that struggles to find comparable information elsewhere on the web.

Property of TechnologyAdvice. © 2026 TechnologyAdvice. All Rights Reserved

Advertiser Disclosure: Some of the products that appear on this site are from companies from which TechnologyAdvice receives compensation. This compensation may impact how and where products appear on this site including, for example, the order in which they appear. TechnologyAdvice does not include all companies or all types of products available in the marketplace.