Time for action – moving a playing card around
In this example, we will place two playing cards on a web page and transform them to a different position, scale, and rotation. We will tween the transformation by setting the transition:
- To do this, create a new project folder with the following hierarchy. The
css3transition.css
andindex.html
files are empty now and we will add the code later. Thejquery-2.1.3.min.js
file is the jQuery library that we used in the previous chapter.index.html js/ js/jquery-2.1.3.js css/ css/css3transition.css images/
- We are using two playing card graphic images in this example. They are
AK.png
andAQ.png
. The images are available in the code bundle or you can download them from the book assets website at http://mak.la/book-assets/ ...
Get HTML5 Game Development by Example : Beginner's Guide - Second Edition now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.