SoFunction
Updated on 2025-03-01

Fixed position floating window instance implemented by javascript

This article describes the fixed position floating window implemented by JavaScript. Share it for your reference. The specific implementation method is as follows:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http:///TR/xhtml1/DTD/">
<html xmlns="http:///1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>FixedFixed position suspension</title>
<style>
* { font-size:12px; font-family:Verdana,Song style; }
html, body { margin:0px; padding:0px; overflow:hidden; }
.b { margin:0px; padding:0px; overflow:auto; }
.line0 { line-height:20px; background-color:lightyellow;
padding:0px 15px; }
.line1 { line-height:18px; background-color:lightblue;
padding:0px 10px; }
.w { position:absolute; right:10px; bottom:10px; width:160px; 
height:240px; overflow:hidden; border:2px groove #281;
cursor:default; -moz-user-select:none; }
.t { line-height:20px; height:20px; width:160px;
overflow:hidden; background-color:#27C; color:white;
font-weight:bold; border-bottom:1px outset blue;
text-align:center; }
.winBody { height:218px; width:160px; overflow-x:hidden;
overflow-y:auto; border-top:1px inset blue;
padding:10px; text-indent:10px; background-color:white;
}
</style>
</head>
<body>
<div class="w">
<div class="t">Demo Win - Fixed</div>
<div class="winBody">Hello world</div>
<div>https:///</div>
</div>
</body>
<script>
//For testing, randomly generate certain contentfor(var i=0; i<400; i++)("<div class=\"line"+(i%2)+"\">"+(new Array(20)).join((()*1000000).toString(36)+" ")+"<\/div>");
//The code is as follows:new function(w,b,c,d,o){
d=document;b=;o=;c="className";
(w=("div"))[c]= "b";
for(var i=0; i<-1; i++)if(o[i][c]!="w")(o[i]),i--;
( = function(){
 =  + "px";
 =  + "px";
})();
}
</script>
</html>

I hope this article will be helpful to everyone's JavaScript programming.