JavaScript 实现 DIV 模拟弹出窗口及滚动跟随效果

作者:闭包旅人时间:2026-10-22 21:03:21浏览:272

本文介绍如何使用 JavaScript 和 DIV 元素模拟弹出窗口,并实现窗口内容随页面滚动而跟随的效果。通过简单的 DOM 操作和事件监听,可以创建灵活的自定义弹窗组件,适用于各种需要提示或交互的场景。

JavaScript 实现 DIV 模拟弹出窗口及滚动跟随效果

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN"> <head> <title>可滚动跟随弹出框效果代码——本站</title>  </head> <body> 作者:丁学--滚动跟随 <div id="pop" style="border:1px solid #CCC;display:none;">test<br>hide</div> <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> show <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> </body> </html> 

[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]

作者最新文章