
Originally Posted by
ekat
top: expression(eval(document.body.scrollTop));
There's no need to use the eval function - the scrollTop property evaluates to a number - though you should append a unit.
But for some reasen when I include the uri into the DTD:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
That's the document type declaration (DOCTYPE), not the DTD (document type definition). The declaration references a DTD. The URI that you're referring to is known as the system identifier. The quoted string before it is the public identifier (a formal public identifier, in this case).
it's not working. Any ideas?
IE, like some other browsers, features DOCTYPE sniffing, a rather dubious solution to a common problem: historically, documents that omitted a DOCTYPE completely, or used a Transitional FPI without a system identifier, weren't written in a way that conformed to standards. They depended on rendering errors in browsers of the day to look as the author intended. In fixing those bugs, browser vendors would break these legacy documents.
The "solution" that is used is to intentionally break the rendering engine for documents that might need the old bugs. In "Quirks" mode, as it's known, IE 6+ considers the body element to represent the viewport, rather than the html element in "Standards" mode. IE 5.x and earlier is effectively always in "Quirks" mode.
What you need to determine is what "mode" is used, then choose the element appropriately:
Code:
function getRootElement() {
if ((typeof document.compatMode == 'string')
&& (document.compatMode.indexOf('CSS') != -1)
&& document.documentElement)
return (this.getRootElement = function () {
return document.documentElement;
})();
else if (document.body)
return (this.getRootElement = function () {
return document.body;
})();
return null;
}
Under "Standards" mode, IE also enforced more CSS processing requirements. This is why including the unit is also important.
Use the following function in your expression:
Code:
function getScrollY() {
var root = getRootElement();
return root ? root.scrollTop : 0;
}
The CSS declaration itself should look like:
Code:
top: expression(getScrollY() + 'px');
Hope that helps,
Mike
Bookmarks