HTML+JS Wallpaper Animations

So forever ago I made this image I called “Timeish” because it kind of reminded me of a clock face. A few months back I was playing around with the Photoshop file and found out I could create simple animations, and so I created this video. Before uploading to YouTube it actually looked half decent, but it was admittedly fairly large for 10 seconds of a spinning blue picture. Anyway, I started toying around with Javascript and HTML and eventually cooked up this thing instead.

I also have animations for two other images. One is from the image “Tunnelling“, and the animation can be found here. The other one I didn’t actually put up on deviantArt but I just called it “Spinner“.

There are a bunch of different things you can do to affect the animation:

  • Scroll the mouse wheel up and down to increase/decrease all layers’
    rotation speed.
  • Space bar, or middle click, to randomize rotation speed.
  • Backspace, or left click, to set rotation speeds to default.
  • Escape to slowdown and stop the rotations.
  • Q to immediately stop and reset all layers to a 0 degree rotation.
  • Number keys (0-9, each number affects a different layer):
    • #: Increase rotation speed by 0.1.
    • Ctrl+#: Increase rotation speed by 0.01.
    • Shift+#: Decrease rotation speed by 0.1.
    • Shift+Ctrl+#: (You guessed it) Decrease by 0.01.

This entry was posted in Coding and tagged , , . Bookmark the permalink.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.