We have learned to use tables and Style Sheets to simulate animation. Changing
the direction of the animation can be useful.
One attempt using tables looked like this.
Another attempt using style sheet attributes looked like this.
Consider changing the table images to move in "directions".
- Create a table 8 X 8
- Place all "blanks" in the table.
- Place a button on the page
- Onclick place your image randomly in one of the 64 cells
- Then start animating following these rules:
- Set a global direction variable to 0
- Now, randomly select a new direction (a number from -4 to 4) where
0 means don't move, -4 means move up and back, ...
- IF valid, move otherwise select again
- Call your function recursively