This is a money game for kids created with KineticJS. It can be played using any HTML5 browser, including mobile devices. This project has simple examples of using images, transitions, handling mouse, touch and drag events, and handling resizing. It also includes a custom Kinetic.Shape, the RoundedRect.
Piggy Bank clip art found from clipartist.net.
How to play
- Deposit coins into the piggy bank slots.
- When you have filled each with the correct amount, the piggies will jump for joy.
- You may have to break a coin into smaller change in order to get the exact amounts. Drop a coin into the 'Need change?' area to get 5 pennies for a nickel, 2 nickels for a dime, or 2 dimes and a nickel for a quarter.
- To see the contents of a piggy bank, mouseover for 2 seconds, or on a mobile device touch and hold for 2 seconds.
Play at bsiegal.github.com/PiggyBanks.