Title: JavaScript FloatIntoView - Keep an area visible during scrolling

Description:
MS Internet Explorer client-side JavaScript that floats an area (<DIV>)
vertically as the page is scrolled.
Keeps an area of the web page in view as a long web page is scrolled up and
down.


1. The FloatInitialize function needs to be called from the <BODY> tag.

<body onload="preloadImages();FloatInitialize();">


2. Put a <DIV> tag around the area to be floated.
In this example, the "DivFloatText" area is initially located at left 455
and top 371 and
floats down the page as the page is scrolled downward.

<div id="DivFloatText"
style="position:absolute;left:445;top:371;visibility:show">
--- Area to be floated ---
</div>


3. Put a <DIV> tag at the end of the vertical area to which "DivFloatText"
can float.
This <DIV> tag does not have any text in it.

<DIV ID="DivFloatTextEnd" style="position:relative;top:0px"></DIV>


4. The JavaScript that floats the "DivFloatText" <DIV> area to keep it
visible while scrolling.

<script type="text/javascript" language="JavaScript">
<!--
var objFloatText
var objBottom
var intWindowHeight
var intBottom
function FloatInitialize(){
// Allow only MS Internet Explorer to see floating DivFloatText
if (navigator.appName!="Microsoft Internet Explorer") {return};
// Instantiate object pointer to DivFloatText DIV
objFloatText=document.all? document.all.DivFloatText :
document.getElementById? document.getElementById("DivFloatText") :
document.layers? document.DivFloatText : 0
if (!objFloatText) {return}
if (document.all || document.getElementById){
intFloatTextWidth=objFloatText.offsetWidth
intFloatTextHeight=objFloatText.offsetHeight
setInterval("FloatIntoView()",200)
objFloatText.style.visibility="visible"
}
}
function FloatIntoView(){
// Called every 200ms to reposition DivFloatText as the user scrolls
var pageoffsety
var intTop
intWindowHeight=window.innerHeight? window.innerHeight :
document.body.clientHeight;
objBottom=document.all? document.all.DivFloatTextEnd :
document.getElementById? document.getElementById("DivFloatTextEnd") :
document.layers? document.DivFloatTextEnd : 0;
if (!objBottom) {
// First Time through, assume a large number.
intBottom=4000}
else {
// Vertical Pixel Number for bottom of area where FloatText should show
intBottom=objBottom.offsetTop;
}
objFloatText.style.left=445; // Left is always the same on this web page
pageoffsety=document.all? document.body.scrollTop : window.pageYOffset;
intTop=Math.max(pageoffsety + 30, 371); // Minimum of 371 from top of page
if ((intTop + 67 + intFloatTextHeight)<=intBottom) {
objFloatText.style.top=intTop
}
else {
objFloatText.style.top=intBottom - intFloatTextHeight - 67;
}
}
// -->
</script>

//Keywords: Javascript, floating text area, scroll text, keep visible