短视频app开发,图片预览时点击任意位置可推出全屏模式

短视频app开发,图片预览时点击任意位置可推出全屏模式

Element 中的图片有预览大图的功能,但是预览完毕后只能点击右上角的关闭图标才能关闭,有点不方便,理想的操作应该是点击图片以外的遮罩层的任意位置即可关闭,只需要在页面加载完成以后加上如下代码即可实现:

 

1
<br>mounted() {<br>    // 通过遮罩层关闭图片预览<br>    document.addEventListener('click',function(e){<br>        if(e.target.className=="el-image-viewer__mask"){<br>            let close = document.querySelector(".el-icon-circle-close");<br>            close.click();<br>        }<br>    });<br>},

以上就是 短视频app开发,图片预览时点击任意位置可推出全屏模式实现的相关代码,更多内容欢迎关注之后的文章

 

posted @   云豹科技-苏凌霄  阅读(50)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 25岁的心里话
· 按钮权限的设计及实现
点击右上角即可分享
微信分享提示