Sunday, April 14, 2013

drawing illusions with code

This is a bit of code I wrote that creates the outfield icon perimeter in the Internet Baseball Scorecard 2013.

To show you how it's made, below I add 'border: 1px solid;' to two 'containers'.

The border reveals the two containers which each have a white background. The inner shape is a 'border-radius:' - code that lets you put rounded corners on a box.

Here I show the two containers pulled apart. I moved the right-hand container 'left: 30px;'.

If I put a box with a white background around the half circle you can see the five shapes create an illusion:

A floating semi-circle. The top of a parachute. Perhaps the ice-cream end of the cone.

'radius-simple' - that will go into the scorecard


No comments:

Post a Comment