'Pinning' ? It's a term I'm using to classify an objective in IE6. 'Pinning' a DOM element to the bottom of the browser window. For most newer generation browsers it's not really an issue, simply use position: fixed;
but for IE6. Well... as usual... that's another story.
So what exactly is 'Pinning'? Facebook has a great example of it on their 'application' toolbar that will neatly sit at the bottom of your screen in all browsers. Another example is a website I found whilst reading up on the subject. http://www.cathedrallettings.com/
I was lead to a CSS hack that involves 'Dynamic Properties'. Another marvelous method from Microsoft. This allows you to set a CSS property based on the result of a Javascript expression, which to quote Bill and Ted is 'most excellent'.
Simply use the expression();
JScript function (NOTE: expression();
is a function only available in Microsoft's flavor of Javascript; JScript) as a property for your CSS attribute and then throw in some regular Javascript. In my case...
* html div#footer { position: absolute; top:expression(eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop +(documentElement.clientHeight-this.clientHeight) : document.body.scrollTop +(document.body.clientHeight-this.clientHeight)); }
Pretty funky stuff ! and really quite handy in solving a problem that's been bothering me for a while now. Especially on my own site www.tonycollings.com
Further reading :
- http://msdn.microsoft.com/en-us/library/ms537634%28VS.85%29.aspx - Dynamic Property Documentation from the Microsoft Developer Network (MSDN).
- http://www.javascriptkit.com/dhtmltutors/dynproperty2.shtml