Trying to recreate the Flash orca whale just using HTML, JS and CSS.
You can see a live demo here. It's in a very early state.
I have implemented some debug parameters, so you can 'play' with them. Just place ?debug=true&code=true
where you can replace code
with:
wireframes
: This will draw square lines arround each piece of the whale.transparent
: This will remove the image from each piece of the whale.background
: This will color each piece with black at 10% opacity, replacing its image. This also color pieces without image yet.no-water
: This will remove the water background.no-bubbles
: This will remove the bubbles effect.
Try some URLs like:
- http://lordfido.github.io/orca/?debug=true&no-water=true&wireframes=true
- http://lordfido.github.io/orca/?debug=true&no-bubbles=true&background=true
- http://lordfido.github.io/orca/?debug=true&no-bubbles=true&no-water=true&transparent=true
This project was initiated by a teammates' challenge, in our free time.