首页网页弹窗代码

网页弹窗代码

时间: 2023-08-12 20:07:42 浏览: 75

点击弹窗代码

5星 · 资源好评率100%

点击弹窗代码

以下是一个简单的弹窗代码示例： ```html <!DOCTYPE html> <html> <head> <title>弹窗示例</title> <script type="text/javascript"> function showPopup() { var popup = document.getElementById("popup"); popup.style.display = "block"; } function hidePopup() { var popup = document.getElementById("popup"); popup.style.display = "none"; } </script> </head> <body> <button onclick="showPopup()">点击弹窗</button> <div id="popup" style="display: none;"> <h2>欢迎来到我的网站！</h2> <p>这里是一些文本内容。</p> <button onclick="hidePopup()">关闭</button> </div> </body> </html> ``` 这个代码示例包含两个 JavaScript 函数：`showPopup()` 和 `hidePopup()`。当用户点击按钮时会调用 `showPopup()` 函数，该函数会将弹窗的 `display` 样式属性设置为 `block`，从而显示弹窗。当用户点击弹窗的关闭按钮时会调用 `hidePopup()` 函数，该函数会将弹窗的 `display` 样式属性设置为 `none`，从而隐藏弹窗。

阅读全文