• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 333
  • Last Modified:

Html5 animation

I attached in my sample model image..How to create a animation in html5 this model..?.
Please anybody help, and send step by step guide..?

1 Solution

Well, you have to explain better your question - do you want to have a video in your web page or as is on the JPG image applied rollover effect.

For video in HTML 5 you have next code:

<video class="rimg" controls="true" width="720" height="576" autoplay="true">
  <source src="yourvideo.mp4" type="video/mp4" />
  Your browser does not support the video tag.

Of course it is for video with MP4 extension. You have to put width and height of your own video because my values width="720" height="576" are for one of my video.

And this video have a name yourvideo.mp4. But, you can choose another name and rename to cards.mp4 or something else.

The command autoplay="true" enable that video will start immediately when your web page will be  shown in an browser. If you want to start it manually you can set autoplay="false".

And finally command controls="true" means that your video will be shown in player with buttons for start, pause, volume etc.

But, if you want to have a rollover than you have to put two images that you want to show.


If you think about some interactivity, you need to use html5 transitions and animations, here's very interesting article:

You may read this as well: http://www.html5rocks.com/en/
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now