Internet Explorer Oddities. The OBJECT tag and position:fixed. Still!

OK. So a couple of more Internet Explorer specific oddities I came across the other day. The rather elusive support for the Object tag in IE and also a really disappointing realization that position: fixed STILL! does not work in IE. No.. Wait. It does. If you're a masochist and like working with strict !DOCTYPE's.

Internet Explorer 7 and later. Fixed positioning is only supported for pages using a strict directive.

- http://msdn.microsoft.com/en-us/library/ms531140%28v=vs.85%29.aspx

Firstly the humble OBJECT tag and Internet Explorer

The objective: embed "application/pdf" data into the object tag to affect inline previewing of PDF documents. Simple enough. Fantastic support in all browsers INCLUDING Internet Explorer, UNTIL you want to dynamically change the "data" attribute on the fly, say with Javascript. A cursory glance of the MSDN documentation for the OBJECT tag does hint at it being a "get" AND "set" property (http://msdn.microsoft.com/en-us/library/ms535859%28v=vs.85%29.aspx) the practice is rather different. No amount of Javascript would affect a successful ability to change the "data" attribute on the fly.

The Solution With some server-side script to (bool)detect IE. If NOT IE then use the traditional

 
<object id="pdf-container" data="/some-pdf-file.pdf" type="application/pdf" width="800px" height="600px"></object>

way of doing things. However! If Browser Engine = Trident then my best solution was to create a wrapper div

<div id="pdf-object-wrapper"></div>

simply create a javascript variable that contained the necessary html.

span style="color: #3366CC;">'<object id="pdf-container" data="''" type="application/pdf" width="800px" height="600px"></object>';

and inject the HTML into my wrapper <DIV> Voila!

Addendum. The OBJECT Tag, Apple Mac's and Firefox

OK. For whatever reason it seems that the "official" Adobe Reader Plug-in is NOT supported in Firefox... on the Mac' ONLY! Instead Google Code has a suggested .xpi alternative. Now my next problem was getting the .xpi to tricker an Installer event from an HTML hyperlink rather than simply downloading the .xpi file. Solution :

Firstly the Javascript Function

span style="color: #3366CC;">"PDF Plugin for Firefox": { 
			URL: oEvent.target.href,
			IconURL: ''"rel"// This is Gecko based ONLY JS. 

Secondly, the HTML

 
<a href="dir/to/acrobat-reader.xpi" rel="sha1:{$sPDFXPIHash}" onClick="return fnInstallPDF_XPI(event);">Click to Install</a>
 

NOTE: The rel="" attribute. This is a dynamically generated SHA1 file_hash check to avoid potentially corrupt downloads. My server-side language of choice is PHP. So

- http://www.php.net/manual/en/function.sha1-file.php

Voila! Now a Firefox Installer trigger is fired when the user clicks on the link.

Internet Explorer and CSS position:fixed

It STILL appears that position:fixed is not supported in IE(7/8). Why!? I have a DOM element I want to stay at the BOTTOM of the page no matter if I scroll.

would do that! It works great in everything but IE. Why, why, why Internet Explorer! Now I have to dust off a REALLY nasty CSS hack I was using in IE6:

span style="color: #ff0000;">'CSS1Compat'

NOTE: The "+8" This was some additional math to apply a minor offset.
The only negative aspect of this is that it's not supported in IE8. MSDN - About Dynamic Properties (Expressions), but fortunately IE8, and especially IE9 show a lot more promise in abiding to standards!