This article describes the method of JS simply implementing the fixed position of DIV relative to the browser. Share it for your reference, as follows:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" ><html><head><title>Anchor Properties</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><meta content="noindex, nofollow" name="robots"><script>function Totop(){ window.scrollTo(0,0);}function bottom(){ //scrollHeight property is to get the scroll height of the object. window.scrollTo(0,document.body.scrollHeight);}function left(){ //alert("left");alert(document.body.scrollLeft) var left = 0-document.body.scrollWidth;//pixel moving to the left window.scrollBy(left,0);}function right(){ //alert(document.body.scrollWidth); //width of the entire scroll bar window.scrollBy(document.body.scrollWidth,0);}function init(){ var init_pos=oLayer.style.posTop; var init_left=oLayer.style.posLeft; document.body.onscroll=function(){ //document.body.scrollTop is equal to the distance from the upper end of the scroll slider to the start point of the scrolling oLayer.style.posTop=document.body.scrollTop+init_pos; //scrollLeft Set or get the distance between the left boundary of the object and the leftmost end of the currently visible content in the window oLayer.style.posLeft=document.body.scrollLeft +init_left; }}</script></head><body onload="init()"><a onclick="bottom()">Set the bottom</a><div id="oLayer" style="position:absolute;left:120;top:60;z-index:2;background:green;width:120px;height:120px"> ddddd</div><br><a onclick="right()">Set right</a><div>width="2000px"</div><a style="float:right" onclick="left()">Put the left</a><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><For more information about JavaScript related content, please check out the topics of this site: "Summary of JavaScript switching effects and techniques", "Summary of JavaScript search algorithm skills", "Summary of JavaScript animation effects and techniques", "Summary of JavaScript errors and debugging techniques", "Summary of JavaScript data structures and algorithm skills", "Summary of JavaScript traversal algorithms and techniques", and "Summary of JavaScript mathematical operations usage"
I hope this article will be helpful to everyone's JavaScript programming.