Fivetwelve

Again, this is more a note to myself, but I find the best function to preload images with jQuery is the following:

jQuery.preloadImages = function() {
     for(var i = 0; i<arguments.length; i++)
    {
          jQuery("<img>").attr("src", arguments[i]);
    }
}

This accepts X amount of arguments and can be called like the following:

$.preloadImages("/static/img/loadinganimation.gif", "/static/img/throbber.gif");

Why would you want to do this? Simple – if you’re using any “loading animations” on your site, with animated GIFs, you may find that on first activation on certain browsers the GIF is missing. If you preload it using a function like this one, your problem is solved.

Credit to this function goes to bloggingdeveloper.com.

One thing that I’ve seen lots of people ask questions about is how to reliably pause or sleep execution of Javascript code. There are a variety of solutions, however none seem to be reliable as Javascript cannot really handle this functionality, except if you use setTimeout, which is no good if you just want to not consider any events, and you just want a bog standard sleep like PHP has. (more…)

EasySlider is an awesome quick and easy jQuery plugin to get things sliding with ease. I’ve used it on a clients site and found it very easy and versatile. There are plenty of options and customisations such as varying speed, pause length, repetition and so on.

There was one thing I noticed, however, that wasn’t customisable. A simple pause facility when someone hovers their cursor over the EasySlider object. I know from experience that putting something on a continuous loop is great to add a bit of movement to the page, but is no good if the user can’t stop it while they’re reading the content of the slide. (more…)