‘Javascript’ Archive

The magic of ‘onload’, revealed!

In JavaScript the onload event is triggered when a page or element has finished loading. We’re advised not to use it when firing off web applications or small enhancements because most of the time these things don’t require the page to have fully loaded, they just require the DOM to be ready.

(more…)

New jQuery plugin: Pulse

This is a brand new plugin which applies a continual pulse to any element specified. ‘Pulseable’ properties include "background-color’, ‘color” ‘border-color’ and ‘opacity’. Specifying more than one property to pulse on a single element can have a pretty cool effect.

Visit the plugin page »

(more…)

How to make a navigable & horizontally scrollable portfolio

In this short tutorial I’ll be demonstrating how easy it is to create your own horizontal scrolling portfolio. Obviously you can use this effect for things other than a portfolio; you could use it for a short photo gallery, slideshow or a product showcase…

Have a look at the demo to see what I’m talking about.

(more…)

Cool Characters in Twitter - A GreaseMonkey Script!

Recently there’s been some "hype" around the previously unknown fact that Twitter accepts cool UTF-8 characters. To be honest I never really assumed otherwise but the story covering it got over 2000 diggs today so I’m probably in the minority.

The actual story which was dugg was offering a bookmarklet which you can press to bring up a popup window which enabled you to copy (*gasp*) and paste (*gasp*) funny characters into your tweets. The only problem with this being that it is manual and not really worth the effort… not even slightly! I’m quite lazy so cannot be bothered to open a new window… go into that new window… highlight a bit of text… copy it… select the twitter window… and then paste it into the textbox! So, spending that wouldbe wasted time I created a sweet little GreaseMonkey script which does all of it for you!

(more…)

“seekAttention” - jQuery plugin

Recently I’ve been working on a brand new plugin for jQuery. It’s not quite finished and it’s in the "experimental" stages but I think it’s progressed enough for a release.

The new plugin is called "seekAttention" and allows any element on a page to seek the users attention… with added effects! I’ve been careful to take usability and customization into account with this plugin. It’s fully automated - it detects element size and builds an overlay to suit that element and you have a number of options so you get to decide how the plugin behaves.

(more…)

Style Switcher - *Non* jQuery version

A tutorial that I wrote explaining how to develop a degradable style switcher in jQuery and PHP has just been published on NETTUTS.

I thought it would be a good idea to expand on the tutorial for the benefit of those who want to integarete the style-switcher into their own website.

(more…)

Useful Bookmarklets

Okay… We all know about the ‘javascript’ pseudo protocol and how wrong it is to use it within links to initiate functions. What I’m talking about here is doing some like this: (please don’t!)

<a href="javascript:func(this)">Linky</a>

There is one valid way to use it though… You’ve probably seen quite a few sites that have bookmark links intended for you to drag the link to your bookmarks panel within your browser. These links are not limited to plain old URLs! - You can actually put javascript within them (with the ‘javascript’ protocol) so when you click on one it can carry out something on the page you’re currently on. These are known as "bookmarklets" and can be really useful!

(more…)

Tip: Three useful JavaScript functions

There are a certain number of stock JavaScript functions which I tend to use on most projects. Normally I’ll create a function if a task needs to be carried out quite a few times. So, here we have a newElement function, a style function and a toggleVisibility function. It’s pretty obvious what each of them do…

(more…)

Search term highlighting

This has been around for a while (Probably since the days when WEB 2.0 was still in fashion), but I’ve only seen it utilised on various forums and a few informational sites in the past. Even though most browsers’ "find" function is only a couple of keystrokes away (ctrl+F) I think this search-term highlighting thing is really great and makes it even easier for the user to read and navigate the content of your site!

(more…)

Developing a jQuery plugin

One of the reasons I think jQuery is the best JavaScript library is because of all the plugins available. There are thousands! So, in this article I’ll be demonstrating the ease with which you can develop your own jQuery plugin!

(more…)