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 ...
随机推荐
- python pip list 命令列出所有安装包和版本信息
c:\Python27\Scripts>pip listDEPRECATION: The default format will switch to columns in the future. ...
- Redis设置密码重启后失效的解决方案
原因可能有两个: 1.只是单纯的通过命令行设置了密码,这种设置方式是临时的,当服务器重启后,密码会失效. config set requirepass yourPassword 解决方案:在redis ...
- 程序猿职场心理学,教你三进三出“斩”HR拿offer(跳槽必看)
摘要: 今天主要涉及到的是 HR 在面试时有哪些套路,这样可以见招拆招,斩获 offer! 今天主要涉及到的是 HR 在面试时有哪些套路,这样可以见招拆招,斩获 offer! 主要包括以下内容: 一. ...
- C语言实现strlen函数的几种方法
原文地址:http://www.51testing.com/html/72/n-221172.html 传说常见的一个笔试题:不使用中间变量求const字符串长度,即实现求字符串长度库函数strlen ...
- Low-level Native Plugin Interface
http://docs.manew.com/Manual/index.htm https://docs.unity3d.com/Manual/NativePluginInterface.html ht ...
- JQuery判断input是否被禁用
<script src="jquery.min.js"></script> <br/><input type="text&quo ...
- 如何用tomcat发布自己的Java项目
如何用tomcat发布自己的Java项目 tomcat是什么?它是一个免费的开放源代码的Web 应用服务器,属于轻量级应用服务器.我们用Java开发出来的web项目,通过tomcat发布出来,别人就可 ...
- csharp编写界面,opencv编写类库,解决 Pinvoke过程中的参数传递和平台调用问题
使用csharp 编写winform程序,不仅速度快,而且容易界面美化并找到其他类库的支持:而使用 opencv编写图形图像处理程序,是目前比较流行,而且高效的一种方法.如果需要将两者结合,需 ...
- 20145329 《网络对抗技术》Web安全基础实践
实践的目标 理解常用网络攻击技术的基本原理.Webgoat实践下相关实验:SQL注入攻击.XSS攻击.CSRF攻击. 实验后回答问题 (1)SQL注入攻击原理,如何防御 攻击原理 SQL注入即是指we ...
- 20145333茹翔 Exp7 网络欺诈技术防范
20145333茹翔 Exp7 网络欺诈技术防范 1.实验后回答问题 (1)通常在什么场景下容易受到DNS spoof攻击 局域网内的攻击,arp入侵攻击和DNS欺骗攻击 公共wifi点上的攻击. ( ...