Category: Programming

IE DOCTYPE Strikes Again

OK, I understand IE's whole DOCTYPE quirks vs. standards (or strict) CSS variations (I don't agree, but I understand). But when did they decide to change their javascript as well (without backwards compatibility)?

http://aranea.zuavra.net/index.php/5 and http://www.quirksmode.org/js/doctypes.html

Basically, when you switch to standards mode, some of the IE proprietary javascript properties move from document.body to document.documentElement. document.body.scrollTop is now always 0 on a standards-compliant page, and the value can be found in document.documentElement.scrollTop instead.

Really, would it have been so hard to leave the document.body.scrollTop value? I know that the IE freaks love to tell us we should develop a million separate CSS files for each damn browser version they throw at us, but having to develop separate javascript as well is enough to make me want to jump up and down and scream violent profanities at my monitor.

IE Submit() AutoComplete

Another subtle IE problem - when using javascript to invoke the submit() method of a form, AutoComplete form data is lost. But thank goodness there is a decent fix for this one, provided we pull some CSS and DOM tricks out of our hat.

Broken Example

Fixed Example

IE DOM Lost Form Cache

Another nitpicky issue I have with IE. Whenever you use DOM to manipulate form fields, IE loses the form field's cache value. So if you play with DOM and have users with back buttons, prepare for grief.

Broken Example

Fixed Example


Update 04/02/2006: I found a similar problem in Firefox. It is triggered by a more complex example involving tables and new form fields.

Broken Firefox Example

IE High Contrast Relative Font Size Conflict

Yup, another fine IE bug.  We were getting rare and unreproducible large (HUGE!) font size complaints from users on a new page (all the old pages were just fine) and only in IE.  Customer Service - with the help of one clever user - finally tracked down the issue to the Windows XP Accessibility feature called "High Contrast."  In my futile attempts to make the new page compatible with this Windows feature, I trailed the feature's failure down to nested relative font sizes.  This is a fun one to reproduce on your own computer.  Imagine all the lovely places it will occur on your own supposedly perfect web pages!

Broken Example

Fixed Example

IE Scrollbar/DOCTYPE Conflict

I found this one at work.  The focus of an element disappears when clicking the scrollbar - but only in xhtml compliant pages!  This irritated an amazingly huge number of people.  Yet another instance of IE punishing me for trying to be standards-compliant.

Broken example

Fixed Example

Pegs

copyright 2002 mleiv

To place pieces on the board, you must be in Setup mode (with the Setup button depressed). To add a piece, click on the empty space where you wish the piece to go. To remove a piece, click on the piece and it will disappear.

To solve the board click the Solve button. While solving all options are disabled. You will not be able to click the Setup or the Solve button until the solution has finished its presentation.

This game was created for the sole purpose of advertising my pretty game board. I do not stand behind its reliability, skill, or speed in any way. It only works on DOM-compliant browsers like IE 6+ and Firefox.

Paper Dolls

The Rapture

Rapture Game, copyright 2005 mleiv
 
 

Switch to our mobile site