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

作者:闭包旅人

时间:2026-10-22

浏览:273

本文介绍如何使用 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需再刷新一下页面才能执行]

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章