Dented Reality

All posts tagged 'browser'

An Open Letter to IE6 for 2009

Dear Internet Explorer 6,

How are you feeling? How was your New Years? Probably a bit lonely I expect, what with people deserting you left and right for your ritzy sibling, IE7, or some of the even more attractive kids on the block like Firefox, Safari and Opera. I know we’ve spent a lot of time together, you and I, but it’s time that I told you something that’s been on my mind for a while.

I don’t think we should see each other any more.

Read the rest of this post…

Making Internet Explorer Behave Like a Real Browser

Recently I’ve been doing a lot of cross-browser work (IE 6 + 7, FF and Safari required to function similarly, unfortunately), and I’ve narrowed down my list of hacks/tricks to make Internet Explorer be able to actually render standards-compliant HTML in a manner remotely befitting a modern browser. Here are my list of “go-to” hacks which seem to fix at least 90% of rendering, layout and positioning issues in IE(6|7).

Read the rest of this post…

Resizing Browser Windows With JavaScript

So here’s an annoying one – I wanted to resize my browser window automatically, after the page had loaded (in a dynamic pop-up), to meet certain size requirements (namely to match a background image). The problem that I had was that all the different browsers support different methods and properties in relation to the ‘viewport’ (visible area of the browser), so I was having trouble finding a reliable way to do this.

I found a great breakdown over at quirksmode.org, but it didn’t actually work in Safari (2.0.2), so I found that out pretty quickly, because that’s what I’m working in. After a little playing around, I came up with the following modifications, which calculates the amount of chrome visible in the currrent window, and then takes that into account when resizing the entire window size.

I haven’t tested this on too much other than Safari and Firefox on a Mac, but I think it should be reasonably compatible with others.

// Viewable size you want once resized
x = 600;
y = 400;

// Now set the window size for different browser types
// all except Explorer
if (self.innerHeight) {
	// Figure out the measurements
	iX = self.innerWidth;
	iY = self.innerHeight;
	oX = self.outerWidth;
	oY = self.outerHeight;

	// And resize to match the desired target
	gX = oX - iX;
	gY = oY - iY;
	window.resizeTo(x + gX, y + gY)
}
// Explorer 6 Strict Mode
else if (document.documentElement && document.documentElement.clientHeight) {
	document.documentElement.clientWidth = x;
	document.documentElement.clientHeight = y;
}
// other Explorers
else if (document.body) {
	document.body.clientWidth = x;
	document.body.clientHeight = y;
}