HTML实现遮罩层的方法 HTML中如何使用遮罩层

发布时间：2020-03-19 03:42 所属栏目：116 来源：站长网

导读：副标题#e# Web页面中使用遮罩层，可防止重复操作，提示loading；也可以模拟弹出模态窗口。实现思路：一个DIV作为遮罩层，一个DIV显示loading动态GIF图片。在下面的示例代码中，同时展示了如何在iframe子页面中调用显示和隐藏遮罩层。示例代码： index.htm

Web页面中使用遮罩层，可防止重复操作，提示loading；也可以模拟弹出模态窗口。

实现思路：一个DIV作为遮罩层，一个DIV显示loading动态GIF图片。在下面的示例代码中，同时展示了如何在iframe子页面中调用显示和隐藏遮罩层。

示例代码：

index.html

XML/HTML Code复制内容到剪贴板

<!DOCTYPE html>

<head>

<title>HTML遮罩层</title>

</head>

<body>

HTML遮罩层使用

</span>

</div>

scrolling="no" frameborder="0"

style="border: 0px;margin: 0px; padding: 0px; width: 100%; height: 100%;overflow: hidden;"

onload="rightIFrameLoad(this)" src="body.html"></iframe>

</div>

（编辑：ASP站长网）