# 全屏视频播放组件01-全屏播放
![](https://img.kancloud.cn/d6/a5/d6a57bed833d502f7969ac584bb28dc1_2604x1518.png)
# 全屏视频播放组件02-右侧的图标按钮
![](https://img.kancloud.cn/38/47/384718d867ffe362690b6f1ba60b0699_2156x1718.png)
# 全屏视频播放组件03-评论框
## 静态版本
![](https://img.kancloud.cn/a7/5d/a75df4848f388e0db2a7d86e658b73f2_2246x1704.png)
## 实现动画
打开、关闭评论框的原理就是修改评论框的 height 属性,0%时关闭,85%时打开。
![](https://img.kancloud.cn/e7/5a/e75a58b6467b19859db60bd73858cb22_1350x828.png)
![](https://img.kancloud.cn/cf/bc/cfbc0343c754e5fedc5139b9f3a889d8_1260x960.png)