How to position the fixed layer in js_javascript skills

You need to obtain the coordinates of some HTML objects to set the coordinates of the target layer more flexibly. Here you can use attributes such as document.body.scrollTop, but these attributes are in standard xhtml web pages, or more simply, with tag is 0; if this tag is not used, everything will be fine. So how to get the coordinates of the body in xhtml? Of course there is a way. We use document.documentElement to replace document.body. For example, we can write like this:

Copy code The code is as follows:

var top=document.documentElement.scrollTop ||document.body.scrollTop;

|| in js is a good thing, not only can be used in if conditional statements , and can also be used for variable assignment. The above example can be written in the following format:

Copy code The code is as follows:

var top=document.documentElement.scrollTop ?document.documentElement.scrollTop : document.body.scrollTop;

Writing like this can have good compatibility. Another thing to note is that if the value of document.documentElement.scrollTop is not declared, 0 will be displayed instead.



Explanation: To get the vertical coordinate position of the scroll bar coordinates on the current page: use
document.documentElement.scrollTop instead of
document.body.scrollTop ;
document.documentElement gets the html tag,
document.body gets the body tag;
Under standard w3c, document.body.scrollTop is always 0, you need to use document.documentElement.scrollTop. Instead;
If we want to position the absolute position of the mouse relative to the page, most of the search engines we will get will ask you to use
event.clientX document.body.scrollLeft, event.clientY document.body. scrollTop;
If you find that the mouse deviates from your imagination, it is not surprising at all, because IE5.5 no longer supports the document.body.scrollX object
So we have to add a sentence;

Copy code The code is as follows:

if (document.body && document.body.scrollTop &&document.body.scrollLeft)
{
top=document.body.scrollTop;
left=document.body.scrollleft;
}
if (document.documentElement && document.documentElement.scrollTop&& document.documentElement.scrollLeft)
{
top=document.documentElement.scrollTop;
left=document.documentElement.scrollLeft;
}

The following describes the usage of some parameters:
Visibility of web pages Area width: document.body.clientWidth;
Visible area height of the web page: document.body.clientHeight;
Visible area width of the web page: document.body.offsetWidth; (including the width of the edge);
Visible web page Area height: document.body.offsetHeight; (including the width of the edge);
Full text width of the web page body: document.body.scrollWidth;
Full text height of the web page body: document.body.scrollHeight;
The web page is scrolled High: document.body.scrollTop;
Left of the web page being scrolled: document.body.scrollLeft;
Top of the body of the web page: windows.screenTop;
Left of the body of the web page: windows.screenLeft;
Screen resolution height: windows.screen.height;
Screen resolution width: windows.screen.widht;
Screen available workspace height: windows.screen.availHeight;
Screen available Working area width: windows.screen.availWidth;
Get the scroll height of the object: scrollHeight;
Set or get the distance between the left edge of the object and the leftmost end of the currently visible content in the window: scrollLeft;
Set or get the distance between the top of the object and the top of the visible content in the window: scrollTop;
Get the scroll width of the object: scrollWidth;
Get the object relative to the layout or specified by the parent coordinates: offsetParent attribute The height of the parent coordinate: offsetHeight;
Get the calculated left position of the object relative to the layout or the parent coordinate specified by the offsetParent property: offsetLeft;
Get the calculated top position of the object relative to the layout or the parent coordinate specified by the offsetTop property Position: offsetTop;
event.clientX: horizontal coordinate relative to the document;
event.clientY: vertical coordinate relative to the document;
event.offsetX: horizontal coordinate relative to the container;
event .offsetY: vertical coordinate relative to the container;
document.documentElement.scrollTop: set the vertical height of the scroll
event.clientX document.documentElement.scrollTop: vertical scroll amount relative to the horizontal position of the document;