layui图片显示
有些东西看文档可以实现,但当真不如自己写的实在。所以还是记录下来吧。
1. 图片赋值
<div id="layer-photos-demo" class="layer-photos-demo" style="padding: 10px;">
@if(empty($classroomSnapShots))
无数据
@else
@foreach($classroomSnapShots as $pictureUrl)
<img layer-src={{$pictureUrl}} src={{$pictureUrl}}
width="400px" height="224px" style="margin: 3px; border: black 2px" ;/> @endforeach
@endif </div>
2. 调用layui.photos
<script>
var $;
var layer;
layui.use(['element', 'jquery', 'form', 'layer'], function() {
$ = layui.jquery;
layer = layui.layer; layer.photos({
photos: '#layer-photos-demo'
, anim: 5 //0-6的选择,指定弹出图片动画类型,默认随机(请注意,3.0之前的版本用shift参数)
});
});
</script>
layui图片显示的更多相关文章
- layui.table图片显示不全和404问题
1.图片显示不全 在使用layui.table组件中,加载的图片显示不全,需重新定义CSS如下: .layui-table-cell{ height: auto!important; white-sp ...
- layui图片懒加载-loading占位图
前言 使用layui的图片懒加载,发现未加载的图片没有loading占位图,显示的是裂图,看着不是很好.找了一些解决方法我统一记录一下. layui图片懒加载使用方法 layui.use(’flow’ ...
- 4.C#WinForm基础图片(显示和隐藏)
要求: 软件上有一张图片,默认是隐藏的.用户在文本框中输入身份证号(131226198105223452),点击按钮,如果年龄大于18岁,则显示图片. 知识点: 取当前年份,Date Time Now ...
- jQuery css3鼠标悬停图片显示遮罩层动画特效
jQuery css3鼠标悬停图片显示遮罩层动画特效 效果体验:http://hovertree.com/texiao/jquery/39/ 效果图: 源码下载:http://hovertree.co ...
- Latex图片显示问题(1)
用latex编译后,若用dvipdf生成pdf文件,则其中有个eps图的左侧会显示不完全:若是用dvips--pspdf生成pdf文件,图像显示没问题. 这种情况的问题出在,加载 graphicx 宏 ...
- WPF 图片显示中的保留字符问题
在WPF中显示一张图片,本是一件再简单不过的事情.一张图片,一行XAML代码即可. 但是前段时间遇到了一件奇怪的事: 开发机上运行正常的程序,在某些客户机器上却显示不了图片,而且除了这个问题,其它运行 ...
- JS控制图片显示的大小(图片等比例缩放)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- Android ListView滑动过程中图片显示重复错乱闪烁问题解决
最新内容建议直接访问原文:Android ListView滑动过程中图片显示重复错乱闪烁问题解决 主要分析Android ListView滚动过程中图片显示重复.错乱.闪烁的原因及解决方法,顺带提及L ...
- java web图片显示到浏览器
今天研究了一下午,图片显示问题. jsp中获取绝对路径的方法:String contextPath = request.getContextPath();String path = request.g ...
随机推荐
- DeepMind已将AlphaGo引入多领域 Al泡沫严重
DeepMind已将AlphaGo引入多领域 Al泡沫严重 在稳操胜券的前提下,谷歌旗下的AlphaGo还是向柯洁下了战书.4月10日,由中国围棋协会.浙江省体育局.谷歌三方联合宣布,将于5月23日至 ...
- Confluence5.8更改数据库配置
Confluence5.8更改数据库配置 第一步:是找到confluence的安装目录,我的安装目录在 /opt/atlassian/: 第二步:由于confluence把tomcat给改造了,所以c ...
- 扩充巴科斯范式(ABNF)
BNF:巴科斯范式ABNF(Augmented Backus-Naur Form):扩充巴科斯范式 ABNF是由第68号互联网标准(”STD 68″,大小写样式按照原文)定义的,也就是 RFC 523 ...
- 牛客网试卷: 京东2019校招笔试Java开发工程师笔试题(1-)
1.在软件开发过程中,我们可以采用不同的过程模型,下列有关 增量模型描述正确的是() A 是一种线性开发模型,具有不可回溯性 B 把待开发的软件系统模块化,将每个模块作为一个增量组件,从而分批次地分析 ...
- Python3基础 yield 在函数中的用法示例
Python : 3.7.0 OS : Ubuntu 18.04.1 LTS IDE : PyCharm 2018.2.4 Conda ...
- Python数据分析入门之pandas基础总结
Pandas--"大熊猫"基础 Series Series: pandas的长枪(数据表中的一列或一行,观测向量,一维数组...) Series1 = pd.Series(np.r ...
- 【第九章】 springboot + mybatis + 多数据源 (AOP实现)
在第八章 springboot + mybatis + 多数据源代码的基础上,做两点修改 1.ShopDao package com.xxx.firstboot.dao; import org.spr ...
- MOOC视频学习
mooc地址 2018/2/6-2/7学习计划: 学习第一周(1.1-1.4)内容. 学习笔记 2018/2/8-2/9学习计划: 学习第二周(1.5.2.1-2.5)内容. 学习笔记 2018/2/ ...
- UVa 12545 比特变换器
https://vjudge.net/problem/UVA-12545 题意:输入两个等长的串S和T,其中S包含字符0,1,?,但T只包含0和1. 用尽量少的步数把S变成T.每步有3种操作: ①把S ...
- NOI 16 买房子
买房子(NOI 16) 总时间限制: 1000ms 内存限制: 65536kB 描述 某程序员开始工作,年薪N万,他希望在中关村公馆买一套60平米的房子,现在价格是200万,假设房子价格以每年百分之K ...