Excellent performance experience highlights of HTML5 Animation

Source: Internet
Author: User
Recently, there have been many comments about "Flash is a technology that is struggling" and "How flash will soon be replaced by HTML5. Personally, I think HTML5 will gradually replace some flash things, But Flash will always have a place, especially for developing complex games and rich Internet applications.
If you haven't seen what HTML5 animations are like, we will collect several HTML5 animations to demonstrate HTML5's outstanding animation capabilities.
Canvas minimal particle Animation

(Font animation, which can be customized by text input. Chinese characters are not supported currently .)
Canvasmol

(This is the well-known c60's molecular structure, 3D animation, and many custom options. It's really no different from flash. Click the list on the left to view more 3D animation molecular structures .)
Flickr and canvas in 3D

(Click the square above to display the image .)
Cloth simulation

(Cloth simulation animation, people who have been in touch with 3D should know this effect .)
Etchaphysics

(In a game animation, you can use a paint brush for something. After you click the clock, these objects will be subject to gravity. I didn't go into detail in the game. The highlight of the animation is to simulate gravity and rigid rebound .)
Google Images gift box-CSS 3D example

(For a rotated three-dimensional box, you can enter the content on it and click search. The box is opened, but the content does not seem to have been searched .)
Liquid participant

(Fluid Particle animation is also a means of 3D animation. But if particles can replace objects like those in 3D software, it would be great .)
HTML5 canvas nebula

(Yunxing animation is implemented through static images. I personally think that javascript can also be implemented earlier, but the effect may not be so good .)
Ball pool

(Elastic ball animation. Simulate gravity and elasticity .)
Bomomo

(A few floating bubbles are paint brushes that can be painted on the canvas .)
There are many animation formats, such as timeline animation, gravity simulation, software simulation, and elasticity. In fact, the HTML5 animation we see is not as brilliant as we have seen before. The biggest difference may be the HTML5 new element canvas. The animation operability of this element is much better than that of the image. However, I think that in the IT industry, the novelty of things is not all about technological innovation, but about the novelty of concepts. Just like Ajax, there is no change in technology, but it brings excellent user experience.
Source: webdesignledger
Compilation: mazingtech (dynasty network wangchao.net.cn)

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.