Internet Explorer’s behavior sometimes really, really makes me angry.

We recently rolled out a copy of our javascript libraries after much testing and, a few hours later, discovered a page on our site that IE was barfing on. Specifically, the page would load about half way and then announce that it could not load the page (despite the fact that it’s clearly loaded behind the error message) and then present you with its generic “page not found” content.

I’ve seen this behavior before and generally know what to look for, but it’s a huge pain because the page is gone and your only method for debugging it is to slowly remove code, line by line, until it stops doing it. Then you put things back bit by bit until you narrow it down to the offending line. It’s painstaking work and the constant error popping up begins to really grate.

So why does IE do this?

Perhaps I should use “when” instead of “why” in that header, because I don’t really know why the developers of IE would do this.

Update: Bit thanks to Jon in the comments for turning me on to this MSFT support page about this topic. I’ve updated this article here to more accurately describe the problem. More detail can be found in the MSFT article.

IE does this when you attempt to modify a DOM element before it is closed. This means that if you try and append a child element to another and that other element (like the document.body) is still loading, you’ll get this error. This will occur if you use .appendChild (which in Mootools includes .adopt, .injectInside, .injectBefore, etc.) or if you use Element.innerHTML = “” (or in Mootools, the .setHTML method). Read the rest of this entry »

Over at Ajaxian today they have a post on miniajax.com which describes itself as “a showroom of nice looking simple downloadable DHTML and Ajax scripts”.

I’m not sure if they authored these scripts or if they just collected them all into slick looking examples. Some of the items link to other sites, but some they seem to host.

Some of these things I think would do well to write as plugins for the Mootools library but if Valerio (the gatekeeper for Mootools) doesn’t want it I think some of them would do well to be added to the CNET Library.

This goes hand-in-hand with the patterns project that we’re trying to kick off here. I think this page could really help inform that work…

Continuing in my current project of rewriting all the javascript on Download.com (pity me), I encountered the functions on the screenshots page. A quick rewrite and here’s my SimpleGallery class. It’s not super-duper fancy but it’s not meant to be. Read the rest of this entry »

So I spent an entire day discovering a quirk about javascript that I must now share. In a previous post on creating default settings for classes/objects I discussed the following technique:

var Widget = new Class({
	initialize: function(element, options){
		this.element = element;
		this.options = Object.extend({
			offsetX: 0,
			offsetY: 0
		}, options || {});
		this.setPosition();
	},
	setPosition: function(){
		this.element.setStyles({
			left: this.options.offsetX + 'px',
			top: this.options.offsetY + 'px'
		});
	}
});

Now, this isn’t a very useful class, but it illustrates the technique. The functions in our class don’t have to worry if the options are defined; they are either what the default value is or they are what the user passed in. If the user elects to just pass in a subset of the values, that’s fine:

var myWidget = new Widget(myElement, {offsetX: 100});
//myElement will be offset by 100 on the left,
//zero (the default) on the top

But what if you want to extend the functionality of your class later? What if you want to be able to insert more default options?

Here’s what I was doing that caused me trouble: Read the rest of this entry »