JavaScript 悬浮窗口实现代码

　　效果如图：

JavaScript 悬浮窗口实现代码

　　代码如下：

<html> 
<head> 
<title>悬浮窗口示例</title> 
<img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20type%3D%22text%2Fjavascript%22%3E%20%0D%0Awindow.onscroll%20%3D%20function%20()%20%7B%20%0D%0Avar%20div%20%3D%20document.getElementById(%22divSuspended%22)%3B%20%0D%0Adiv.style.top%20%3D%20document.body.scrollTop%3B%20%0D%0A%7D%20%0D%0Awindow.onresize%20%3D%20window.onscroll%3B%20%0D%0Afunction%20init()%7B%20%0D%0Avar%20df%20%3D%20document.createDocumentFragment()%3B%20%0D%0Afor(var%20i%3D0%3Bi%3C20%3Bi%2B%2B)%7B%20%0D%0Avar%20p%20%3D%20document.createElement(%22p%22)%3B%20%0D%0Ap.appendChild(document.createTextNode(%22%20Line%20%22%2Bi))%3B%20%0D%0Adf.appendChild(p)%3B%20%0D%0A%7D%20%0D%0Adocument.body.appendChild(df)%3B%20%0D%0Awindow.onscroll()%3B%20%0D%0A%7D%20%0D%0A%3C%2Fscript%3E"> 
</head> 
<body onload="init()"> 
<p>Try scrolling this window.</p> 
<div id="divSuspended" style="position: absolute; buttom: 0px; right: 0px; color: #cccccc; width: 150px; height: 30px; background-color: navy">这是悬浮窗口</div> 
</body> 
</html>

　　 [Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

教程首页更多教程