相信有小伙伴在做网站时有这样的应用场景，对于某张图片有可能我们在页面上展示时显示的是缩略图。而用户有时需要查看原图的场景。
之前给一个一朋友改版网站时，他们网站使用的是直接连接到原图。浏览器又打开一个标签页来显示这张图片。显得不太友好。直接在页面本身来弹出原图的话相对来说比较符合用户体验。
那么如何在原本页面上打开原图呢？
首先我们需要安装layuihtml打开新页面，我们要使用它的弹出层组件。
在需要使用的页面引入layui的css和js后。就可以开始操作了。
在需要弹出原图的图片上新增一个onclick方法。方法名可以自定义。在方法里面我们将原图的地址放入html打开新页面，作为参数可以在调用的时候得到相应的图片地址。
使用layer弹出层里面的photos可以将图片以相册的形式来展示出来。官方给的样例是数组形式的一组相册，今天我们先来看单个图片如何弹出。
layer.photos里面的photos我们需要配置里面的data。这个是需要显示的图片。根据文档你只需要将里面的src传递上我们刚才传递过来的参数即可。里面的anim则是弹出图片的类型，大家可以去试一下。0-6之间的数字。
到此就可以来看看结果了。在写方法之前，一定要将layer在layui中引入一下。
———END———
限 时 特 惠： 本站每日持续更新海量各大内部创业教程，一年会员只需98元，全站资源免费下载 点击网站首页每天更新
站 长 微 信： aiwo51889
声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。
