My Art Site

So I have created a new theme for my art website. I built it off of http://underscores.me/ which is a great starting theme. I studied a few tutorials to figure out how to make the layout scroll horizontally. The links in the navigation menu point to the id of each div. When a link is clicked, the html,body scrolls to that target minus the width of the margin to centre it. At the same time, the background and foreground divs also animate the same distance with different timing.

Getting the whole thing to line up at all screen sizes was a delightful experience. Javascript makes it fairly easy to detect the size of a window and when it resizes, so I was able to dynamically resize the images easily in a browser. The real challenge was making the whole thing work for mobile. It doesn’t help that mobile devices insist on holding onto javascript no matter how many times you try to clear their caches. In the end, I had to rename js files over and over just to test my tweaks.

The sky is a simple CSS gradient that changes based on the hour. The hour also adjusts brightness and contrast effects on the foreground and background images.

Outstanding Issues:

  • The pages are hard coded into the index.php file. I’m not happy about this. It works fine for my website, but WordPress themes should be more dynamic than this. I would like to find a way to load pages dynamically and resize the website to account for new pages.
  • There’s no support for sub menu links.
  • I have disabled the links to entry permalinks. I wasn’t sure how I wanted to display those yet. Right now, they’re just a mess.