什么是弹窗
弹窗是产品中一项常见功能,点击页面中某个元素,在当前页面触发弹出一个窗口,即是弹窗。
弹窗使用场景
通常为了减少页面间跳转、当前页面空间不够或者想减少总体页数的情况下,即可将一些规则说明性的内容,放到弹窗中展示。
效果展示

(扫码打开作品,并点击第一页“查看规则”按钮和第二页“奖励领取说明”按钮,即可体验弹窗效果)
如何使用H5弹窗
进入H5编辑器,在需要添加弹窗的页面上,添加相应引导点击的文字、图片元素,选中后,设置触发--打开弹窗--添加弹窗。

点击“添加弹窗”后,会进入弹窗编辑页面,此时页面默认由:一个白底弹窗+半透明背景+一个关闭弹窗按钮组成。

【弹窗关闭按钮】图标可自行更换,也可以自行设置点其它地方关闭弹窗,只需在点击的触发里,设置为关闭弹窗即可。

【白底弹窗】可设置功能包括如下:
可以在弹窗上任意添加文字及图片,白底弹窗本身也可任意换成其它图片;可以任意拖动改变弹窗的大小,并设置圆角、阴影等;根据H5中各个页面的需要,可以添加多个弹窗,供不同页面调取使用。

【半透明背景】在左侧弹窗上可以对半透明背景颜色进行修改(通常建议保持为半透明状态),弹窗上的图层也可调整层级顺序。

左侧弹窗名字处双击,还可以自行修改,以便于区分。

设置好弹窗后,点击“退出弹窗编辑”,并再次选中“引导点击的文字、图片元素”,点击触发,选择要打开的弹窗。

在当前页面,点击右侧“预览”按钮,在预览页面上,即可查看弹窗的点击效果,方便随时修改。

