【JavaScript】悬浮窗口
2010-09-14 13:37:06 来源:WEB开发网主要是window.onscroll的运用
效果如图:
代码如下:
<html>
<head>
<title>悬浮窗口示例</title>
<scripttype="text/javascript">
window.onscroll=function(){
vardiv=document.getElementById("divSuspended");
div.style.top=document.body.scrollTop;
}
window.onresize=window.onscroll;
functioninit(){
vardf=document.createDocumentFragment();
for(vari=0;i<20;i++){
varp=document.createElement("p");
p.appendChild(document.createTextNode("Line"+i));
df.appendChild(p);
}
document.body.appendChild(df);
window.onscroll();
}
</script>
</head>
<bodyonload="init()">
<p>Tryscrollingthiswindow.</p>
<divid="divSuspended"style="position:absolute;buttom:0px;right:0px;color:#cccccc;width:150px;height:30px;background-color:navy">这是悬浮窗口</div>
</body>
</html>
Tags:JavaScript 悬浮 窗口
编辑录入:爽爽 [复制链接] [打 印]赞助商链接