Archive for the 'JavaScript' Category

Progressive Enhancement

Thursday, September 25th, 2008

One of the things I was doing while working for the College Board was researching strategies for accessible Web content. So it became apparent that Pragmatic Progressive Enhancement, or what we used to call Graceful Degradation, was in fact the best architectural strategy for ensuring an accessible and robust user experience.

(more…)

Delicious via: tag bookmarklet

Saturday, August 16th, 2008

I just got finished writing a new version of the del.cio.us whuffie bookmarklet. It’s a bookmarklet that adds via: tags to your bookmarks for attribution purposes, so you can have a little extra meta-data about where your links are coming from.

(more…)

Firefox Extensions

Thursday, August 14th, 2008

Lately I have been fielding a lot of questions at work about strategies for assuring that the markup is semantic, accessible and valid. I recently compiled a short list of Firefox extensions that test whether XHTML is standards-compliant.

(more…)

del.icio.us whuffie

Saturday, June 16th, 2007

This bookmarklet no longer works. Please use the new whuffie bookmarklet instead. This version of the via: tag bookmarklet broke when Delicious launched their new UI in mid-2008. Congratulations to the Del team on the improved UI, and I hope everyone will enjoy the updated bookmarklets.

Delicious Whuffie is a bookmarklet that, when clicked, adds via:username to the tags field when saving a URL from another user.

This bookmarklet is intended to be used on the “save this” page at del.icio.us. I have also created (and prefer) a version of the bookmarklet that adds the user’s tags along with via:username; as I seem to always do that as well when tagging with via:

(more…)

Neat little example of a useful Javascript closure

Sunday, May 6th, 2007

Closures are a powerful feature of JavaScript. However it’s often hard to explain in a few words, just what is useful about closures. Well, here on page 131 of the Rhino book, is the recipe for a unique ID generator that doesn’t require a global counter.

One thing that I personally enjoy about the Flanagan book is that he says things like “don’t pollute the global namespace.” :) This technique does not pollute the global namespace.

var uid = (
function(){
var id=0;
return function(){
return id++ ;
};
}
)();
//then just say:
alert(uid());


Writing JavaScript

Monday, December 4th, 2006

This began as a post for the JAG internal wiki. But I wound up looking up a lot of good links, so I thought I’d mirror the post here in order to keep those links handy.

When I want to implement a requirement, such as a business rule or DHTML behavior in JavaScript, sometimes I find that I don’t know how to implement that behavior. Sometimes this might be because the requirement is complex, as in the case of DHTML animation. Or the algorithm I am searching for may just be obscure, such as a unique ID generator that uses a closure instead of a global counter.

When I do not immediately know how to implement a requirement, I usually need that information in a hurry. I do not have time to make extensive flow charts, or to research the deep features of JavaScript. What I want is to find someone else who has already implemented something ‘’similar'’ to the requirement. And I want to see their source code.
(more…)

Event Selectors JavaScript/Ajax library at Encytemedia — Design and development crossfade

Monday, November 20th, 2006

http://encytemedia.com/event-selectors/

Another js library that I’d like to use some time.

"event:Selectors allow you to apply an event such as mouseover, mouseout, click, et al using a CSS style syntax."
(more…)

Choose a value with two select menus

Monday, November 6th, 2006

Intermediate Web developers often stumble over the problem of getting select menus to talk to each other. One common problem is the situation where the options that are in select menu B, are dependent upon the option that has been selected in menu A.

Here is one solution to a somewhat different problem, that also involves getting two select menus to cooperate.

The problem is that we have two menus, one of which contains the first part of a choice, and the other contains the second part. Once a selection has been made, how do we collect both parts of the choice; and how do we decide what that particular choice means, in the context of the application? Here is how I would probably implement that.

Choose a value with two select menus

Neat little example of a useful JavaScript closure

Monday, September 11th, 2006

I just picked up the 5th edition of David Flanagan’s JavaScript, the Definitive Guide. I find it amusing that that book is the only JavaScript book officially recommended at comp.lang.javascript.

Closures are a powerful feature of JavaScript. However it’s often hard to explain in a few words, just what is useful about closures. Well, here on page 131 of the Rhino book, is the recipe for a unique ID generator that doesn’t require a global counter.

One thing that I personally enjoy about the Flanagan book is that he says things like “don’t pollute the global namespace.” :) This technique does not pollute the global namespace.

var uid = (
  function(){
    var id=0;
    return function(){
      return id++ ;
    };
  }
)();
//then just say:
alert(uid());

var uid = (function(){var id=0; return function(){return id++ ;};})();

Hover Detail

Sunday, June 11th, 2006

Tonight I added a hover detail to the Flickr thumbnails on the right. If you mouse over a thumbnail, you can see a large version of the photo. If you click on the large photo, its Flickr page loads in a new window.

I’m using the MTFlickrPhotos plugin to generate thumbnails, and to write the HTML for the large images into a hidden DIV. I’d like to load the large images asnchronously, but I need to work out how to request images. So far I’ve just used Ajax.Updater to preload HTML.

Oh yes, did I mention that the hover details are completely hosed in IE?