This is an analog clock script designed to jump in place of a div element of class 'analogclock'.

The div tag is not replaced in this custom element, but instead is used as a pseudo-document to hold the clock itself. The 'hands' are implemented using arrays of generated divs.

I was actually inspired to write this widget because of an article on About.com's Javascript pages written by a guy named Stephen Chapman. His code was a mess, but I only discovered this after delving through two layers of 'unescape()' obfuscation.

The basics: You control the look of the numbers and the 'box' model of the clock using basic CSS. You control the clock's size (it will always be square) using the 'size' attribute.

The 'seconds', 'minutes', and 'hours' attributes are for the color of the 'hand's. 'numstyle' can be 1, i, I, or '.', each refering to a different type of face-numbering for the clock

The 'localzone' attribute tells the script to use the user's local time zone. If it's '0', 'false' or 'no', the clock will use the 'clockzone' attribute to determine what time it is (the clock zone is relative to GMT, so, for example, US Eastern is -5. The clock automagically figures out if we're in DST, so you don't have to.)

The 'city' and 'country' are for if you want to put in the city/country of origin for your clock. To be honest, you can put anything there.

Lastly, I designed my version of the clock to be able to not 'tick', i.e., work like the old-school analog clocks. If you want ticking, add 'tick=1' to the attribute list

As with all of my widgets, the idea here is that you can just include the .js file and start dropping in tags without needing to know any ECMAScript at all.

Additionally, for you ECMAScripters, I was very careful to keep my pollution of the global namespace to one class: analogClock.

Example of use:

This is a swear filter script I wrote for my xanga blog. I don't know if it has any application anywhere else. This will replace the swear words listed in the array with the character defined in blank_char. This isn't perfect but it works pretty well.

Basically, you can dynamically ask the webpage to look at a current object's attributes/values or even change the object's attributes/values. As such, running this script on any browser of your choice should show what attributes your particular browser will allow for an object reference you typed in.

Fade in/out multiple images like a slideshow.

I use this function when passing an array to a function being called from setTimeout();

Add dragging to your div elements. just adding class="drag" to the div element will make it draggable.

Here i'm adding an example for a draggable dialog box

Just a little code to make a window in XUL

One way to group elements in HTML is to assign them a name attribute. Multiple elements can share a name, then you can easily access them as an array using the getElementsByName() method.

The problem is that some DOM parsers aren't keen on, or are ignorant to, this use of the name attribute, so a simple object.name returns undefined. In my case, it was a DIV in Firefox 1.5 that was behaving this way.

There is a simple work around for this that works in Firefox, I haven't tested it in others. It is to use the getAttribute method that is an extension of any element object.

This ability can be useful if you have a function that performs a transformation on the active element, and another transformation on closely related elements.

This snippet also you to limit the input in a form field to a specified number of characters. It displays a counter so users can see how many characters they have left, and once they reach the limit the field just trims the length to your limit.

The following is a snippet from what I used when I implemented a tagboard to my site. Further revisions could/should read the LIMIT from the maxlength attribute

Enforce loadig fresh script code for the external javascript files. Compatible with HTTP 1.0.