Emulate human typing with the jQuery Teletype Plugin

In a recent web project, we came across the need to use an effect to replicate human interaction and emulate this on the website. The requirement was to type out text, optionally delete portions or all of the output and allow simple options to be used to determine the speed, delays amongst other possibilities.

As often is the case, there were a few options to use from exiting jQuery plugins, however none that I came across worked close enough to the requirement – without drastically modifying them to suit. Having previous experience creating plugins using the jQuery library, piecing something together to produce the desired effect was something to look forward to.

On a quiet Sunday afternoon, the first draft of the Teletype jQuery Plugin was complete within a few hours, and soon after released into the public domain. It’s been a while since a small personal project like this has been packaged up and shared with the community, which was one of the main reasons for proceeding with the idea.

Continue reading “Emulate human typing with the jQuery Teletype Plugin”

Today I wrote my first JavaScript tutorial

Today saw the launch of SixCrayons.com, a new design blog focussing on six main categories of front end web development, from design to additional enhancements using scripting languages such as Flash and JavaScript.

Although I have a hand in the majority of categories, JavaScript is something I have a keen interest in and was asked to write a short tutorial on a JS related subject. Continue reading “Today I wrote my first JavaScript tutorial”

Google Maps API default control look-and-feel

Although I haven’t managed to do any work with the Google Maps API for a few months now, I do try and frequent the Google Geo Developers Blog every once in a while.

On my last visit I noticed a post mentioning new functionality that allows you to include the standard user interface elements you get on the main Google Maps site, plus the standard behaviour of keyboard and mouse handling.

Continue reading “Google Maps API default control look-and-feel”

Simple jQuery string padding function

I’ve written a very simple jQuery function to return a string padded to a specified length, similar to the php equivalent str_pad.

$.strPad = function(i,l,s) {
	var o = i.toString();
	if (!s) { s = '0'; }
	while (o.length < l) {
		o = s + o;
	}
	return o;
};

Example Usage:

$.strPad(12, 5); // returns 00012
$.strPad('abc', 6, '#'); // returns ###abc

This version only supports left padding, which is why it is labelled as only a simple version :).