[Javascript] Emulate position:fixed in IE

Thu Sep 4 13:36:01 CDT 2003

A while back I had a similar problem.  Here is the demo code I put together
to test it out:

<html>
<head>
   <title> bogus </title>
   <script language='JavaScript'>
   <!--
      function doDiv() {
         var myDiv = document.forms[0].getElementsByTagName("DIV")[0];
         var divChild = myDiv.children[0];
         var divChildHeight = divChild.height;
         var divChildWidth = divChild.width;
         alert('divChildHeight: ' + divChildHeight + '\ndivChildWidth: ' +
divChildWidth);
      }
   // -->
   </script>
</head>
<body>
   <form name='myForm' id='myForm' action='javascript:void(null)'>
      <center><input type='button' name='pressMe' value='pressMe'
onClick='doDiv()'></center>
      <div id='myDiv' height=0 width=0 align='center' valign='top' border=0>
         <img src='blank.gif' height=60 width=60 bgcolor='blue'>
      </div>
   </form>
</body>
</html>

Obviously, 'blank.gif' is some arbitrary GIF file.  If you are dealing with
a multielement environment inside the DIV, I'd suggest
trying to reference the 'documentElement' properties of the DIV in the same
fashion.

-- Dave Lovering

----- Original Message ----- 
From: "Roger Roelofs" <rer at datacompusa.com>
To: "[JavaScript List]" <javascript at LaTech.edu>
Sent: Thursday, September 04, 2003 9:11 AM
Subject: [Javascript] Emulate position:fixed in IE

> I'm working on a script that will allow ie to kind of emulate the css
> position:fixed; css attribute.  (Code follows)  My problem is figuring
> out the height of the _content_ of the div, rather than the height of
> the div itself.  Currently my script doesn't function properly if you
> resize your browser window to make it larger.
>
> function pretendFixed() {
> if ((typeof(el.nodeType) != "undefined") && (el.nodeType == 1)) {
> var winHeight = 0;
> if (typeof(window.innerHeight) == 'number') {
> winHeight = window.innerHeight;
> } else {
> if (document.documentElement &&
> document.documentElement.clientHeight) {
> winHeight = document.documentElement.clientHeight;
> } else {
> if (document.body && document.body.clientHeight) {
> winHeight = document.body.clientHeight;
> }
> }
> }
> var newElHeight = el.offsetHeight;
> if (winHeight < (el.offsetTop + el.offsetHeight)) {
> newElHeight = winHeight - (el.offsetTop + 10);
> if (el.style) {
> el.style.height = newElHeight + "px";
> el.style.overflow = "scroll";
> }
> }
> }
> }
>
> _______________________________________________
> Javascript mailing list
> Javascript at LaTech.edu
> https://lists.LaTech.edu/mailman/listinfo/javascript
>
>