html5如何实现d出提示框，并且伴随遮罩层并且可以关闭d出框

通过jquery的show()和hide()函数联合使用，实现d出窗口。

一、show（）和hide（）函数解析：

1、show() 方法显示隐藏的被选元素。

注意：show() 适用于通过 jQuery 方法和 CSS 中 display:none 隐藏的元素（不适用于通过 visibility:hidden 隐藏的元素）。

2、hide() 方法隐藏被选元素。

这与 CSS 属性 display:none 类似，但是隐藏的元素不会被完全显示（不再影响页面的布局）。

二、设计一个HTML页面，包括一个简单的d出窗，和一个显示按钮。其中，调用了jquery的以上两个函数。具体代码如下：

三、设计遮罩层的样式，如下：

四、d出窗口的css样式，代码如下：

五、初始页面如下：

六、点击按钮，查看d出窗口结果：

七、关闭d出窗后，打开开发者中心，如下：

方法如下：

1、启动flash后，新建一个大小为600*400，帧频为12fps，背景颜色为白色的文档。

2、执行文件-导入-导入到库命令，导入一张风景图片，设置大小为600*400，x为0，y为0。

3、在100帧处插入帧，新建图层2，选择第一帧绘制一个正圆形。

4、依次在25,50,75,100帧处插入关键帧，并依次设置圆形所在的位置。

5、在相邻的关键帧之间创建传统补间动画，设置图层2为遮罩层。

6、执行文件-导出-导出影片命令，选择gif动画格式，将文件导出后就完成了。

扩展资料：

1、遮罩层的基本原理是：能够透过该图层中的对象看到“被遮罩层”中的对象及其属性（包括变形效果），但是遮罩层中的对象中的许多属性如渐变色、透明度、颜色和线条样式等却是被忽略的。比如，不能通过遮罩层的渐变色来实现被遮罩层的渐变色变化。

2、可以用“Actions”动作语句建立遮罩，但这种情况下只能有一个“被遮罩层”，同时，不能设置_Alpha属性。

3、要在场景中显示遮罩效果，可以锁定遮罩层和被遮罩层。不能用一个遮罩层试图遮蔽另一个遮罩层。遮罩可以应用在gif动画上

4、在制作过程中，遮罩层经常挡住下层的元件，影响视线，无法编辑，可以按下遮罩层时间轴面板的显示图层轮廓按钮，使之变成，使遮罩层只显示边框形状，在种情况下，还可以拖动边框调整遮罩图形的外形和位置。

参考资料来源：百度百科-遮罩动画

工具：电脑；浏览器；ultraedit软件；

*** 作步骤如下：

1、打开UE编辑器，新建一个空白的html文件和css文件；

2、在html文件中输入以下html代码；

3、在css文件中输入以下css代码；

4、编辑完成之后，选择格式为UTF8-无 BOM模式，保存文件；

5、在浏览器中打开此html文件，可以看到最终想要实现的遮住全屏效果。

---