Not long ago, I entered Chris Coyier’s CSS-Off competition. The mock-up was deceivingly harder than it looked, but I managed to put something together that I think should stand a chance of being considered for a prize. The one area that gave me trouble was the use of different colours on different lines of text within an element. I knocked together a quick jQuery plugin to achieve this, and then realised after submitting my entry that it didn’t work at all in Internet Explorer. Doh! Anyways, I have now fixed that, and here is the plugin.
Recently, I was faced with the requirement to make a horizontal navigation bar fixed to the top of browser window, but only when the user scrolls past it. I had a quick Google around, and found a few plugins that did way more than I needed them to. I was certain this could be achieved in a couple of lines using jQuery, so I did it myself.
I apologise in advance, a this is a very old technique, but it’s something I have wanted to try out since last year. A while ago, I stumbled upon Sunrise Design, and absolutely loved the subtle background animation!
Whilst designing the new skin for this site, I made the decision to go for a single page layout with a few other templates for the archive, portfolio and articles pages. I didn’t really consider the impications of this for the speed at which my page loads until I read Chris Coyier’s article about serving images from a subdomain. That got me thinking, especially with all the imagery I was going to need to use. So I had a think about what things I could do to either reduce the size of the page, reduce the number of requests and generally speed things up. Here are three steps I took to do this, which have actually shaved an average of 4 seconds off the page load time.
I saw a flash bar chart the other day, which had a nice animation and looked very nice, and wondered if it would be possible to achieve a similar effect using just XHTML, CSS and a little bit of jQuery.