本文主要是介绍javascript+html实现遮罩层效果，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
<!DOCTYPE html>
<html> <head> <meta charset="UTF-8"> <title>遮罩层实例</title> </head> <body> <button onclick="coverDiv()">显示</button> </body> <script type="text/javascript"> //显示遮罩 function coverDiv(){ var procbg = document.createElement("div"); //首先创建一个div procbg.setAttribute("id","mybg"); //定义该div的id procbg.style.background = "#000000"; procbg.style.width = "100%"; procbg.style.height = "100%"; procbg.style.position = "fixed"; procbg.style.top = "0"; procbg.style.left = "0"; procbg.style.zIndex = "500"; procbg.style.opacity = "0.6"; procbg.style.filter = "Alpha(opacity=70)"; document.body.appendChild(procbg); } //取消遮罩 function hide() { var body = document.getElementsByTagName("body"); var mybg = document.getElementById("mybg"); body[0].removeChild(mybg); } </script>
</html>
以上是完整实例。
这篇关于javascript+html实现遮罩层效果的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
