首先下载官方的layer的js和css, 地址:http://layer.layui.com/ 注意:先加载js后加载layer
layer 的 功能十分强大, 在这里我使用了 其photos即相册层的功能 ,详情看其API 文档
这里我只展示直接读取页面图片的方式
<div id="layer-photos-demo" class="layer-photos-demo"> // html
<div class="grid" >
<img src="图片地址" >
</div>
</div>
$(document).ready(function(){
//jquery方式
//调用示例
layer.photos({
photos: '#layer-photos-demo'
,anim:0 //0-6的选择,指定弹出图片动画类型,默认随机(请注意,3.0之前的版本用shift参数)
});
})
效果如下:
点击图片后: