Recommend 8 HTML5 related special effects to see what functions can be implemented

Source: Internet
Author: User
Keywords HTML5

The intermediary transaction SEO diagnoses Taobao guest stationmaster buys the Cloud host technology Hall


HTML5 is an upgraded version of HTML, HTML5 has two main features: first, enhance the performance of Web pages. Secondly, the functions of WEB applications such as local database are appended. When it comes to generalized theory and HTML5, it actually refers to a set of technical combinations including HTML, CSS, and JavaScript. Today we recommend 8 to use the special effect of HTML5, hope to be able to bring help to everyone's use!

HTML5 implementation of the Gobang game

Online Demo

This is a use of HTML5 implementation of the Gobang effect, and computer games you may not be able to win the second time, do not believe you can click on the online demo.

10244.html Video player-frame player with no video files required


Online Demo

HTML5 video is great, it can be easily used on a variety of devices. But it also has its own problems, such as mobile device players, may have different versions incompatible. Today we introduce this video player to improve the previous results, to use more convenient. I hope you like it!

3D Menu

Online Demo

Perhaps in this era of advanced technology, online ordering is no novelty. The restaurant can be designed for menu, click on the menu name will be appropriate pop-up dishes photos, or also can increase the calories, raw materials and customer evaluation. Definitely a super fashionable idea!

Using HTML5 Canvas to realize the animation effect of tearing cloth

Online Demo

With HTML5 canvas to achieve the effect of tearing cloth, sliding the mouse, cloth will change with the mouse. Click the left mouse button, and then slide the mouse, the cloth will be cut open. If you have not seen this demo effect, it is absolutely realistic to let you shock!

HTML5 Canvas (Canvas) Basics Use and introduction

Download online

Remember in the past Web front-end development, if you need to draw or generate related graphics, using Flash may be the only or the most powerful way to implement, while in recent years the technical Hotspot HTML5 Standard, HTML Canvas (canvas) Can be more convenient to help you achieve 2D graphics image and its various animation effect function. In today's technical tutorial we will introduce the basic canvas use, I hope everyone feel helpful!

2D light effect generated by HTML5 canvas

Online Demo

A metal background, as if the searchlight had made him look more stereoscopic. This is a 2D light source effect generated using HTML5 canvas. Absolutely make you not regret using it!

Flappy Bird Implementation of HTML5

Online Demo

The famous Flappy Bird, believe that the person that knows must be many, click your space, don't let it fall down, see your final result how good. Let's have a look at it.

Sonic-a tool for cyclic loading


Online Demo 1 online demo 2 online demo 3

Sonic is a less than 3k, very small JS class library, you can use this class library to create a custom load animation. It's a very good loop animation, such as you can use it to make a constant chase your tail snake, such animation. Sonic uses the HTML5 canvas element and its associated APIs. It is based on a certain small time interval, based on the predefined path, draw the next shape, so as to complete the animation effect. You can use Arc,bezier, or line methods to define the path.

This week recommended 8 HTML5 generated special effects, I hope to help! Welcome to join the Geek tag, we look forward to your sharing!

Related Article

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: 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.