jquery插件layer
//信息框-例1
layer.alert('见到你真的很高兴', {icon: 6}); //信息框-例2
layer.confirm('你确定你很帅么?', {icon: 3}, function(index){
layer.close(index);
alert('自恋狂');
}); //信息框-例3
layer.msg('这是最常用的吧'); //信息框-例4
layer.msg('不开心。。', {icon: 5}); //信息框-例4
layer.msg('玩命卖萌中', function(){
//关闭后的操作
}); //页面层-自定义
layer.open({
type: 1,
title: false,
closeBtn: false,
shadeClose: true,
skin: 'yourclass',
content: '自定义HTML内容'
}); //页面层-佟丽娅
layer.open({
type: 1,
title: false,
closeBtn: false,
area: '516px',
skin: 'layui-layer-nobg', //没有背景色
shadeClose: true,
content: $('#tong')
}); //iframe层-父子操作
layer.open({
type: 2,
area: ['700px', '530px'],
fix: false, //不固定
maxmin: true,
content: 'test/iframe.html'
}); //iframe层-多媒体
layer.open({
type: 2,
title: false,
area: ['630px', '360px'],
shade: 0.8,
closeBtn: false,
shadeClose: true,
content: 'http://player.youku.com/embed/XMjY3MzgzODg0'
});
layer.msg('点击遮罩任意处关闭'); //iframe层-禁滚动条
layer.open({
type: 2,
area: ['360px', '500px'],
skin: 'layui-layer-rim', //加上边框
content: ['http://layer.layui.com/mobile', 'no']
}); //加载层-默认风格
layer.load();
//此处演示关闭
setTimeout(function(){
layer.closeAll('loading');
}, 2000); //加载层-风格2
layer.load(1);
//此处演示关闭
setTimeout(function(){
layer.closeAll('loading');
}, 2000); //加载层-风格3
layer.load(2);
//此处演示关闭
setTimeout(function(){
layer.closeAll('loading');
}, 2000); //加载层-风格4
layer.msg('加载中', {icon: 16}); //打酱油
layer.msg('尼玛,打个酱油', {icon: 4}); //tips层-上
layer.tips('上', '#id或者.class', {
tips: [1, '#0FA6D8'] //还可配置颜色
}); //tips层-右
layer.tips('默认就是向右的', '#id或者.class'); //tips层-下
layer.tips('下', '#id或者.class', {
tips: 2
}); //tips层-左
layer.tips('左边么么哒', '#id或者.class', {
tips: [4, '#78BA32']
}); //tips层-不销毁之前的
layer.tips('不销毁之前的', '#id或者.class', {
tipsMore: true
}); //默认prompt
layer.prompt(function(val){
layer.msg('得到了'+val);
}); //屏蔽浏览器滚动条
layer.open({
content: '浏览器滚动条已锁',
scrollbar: false
}); //弹出即全屏
var index = layer.open({
type: 2,
content: 'http://www.layui.com',
area: ['300px', '195px'],
maxmin: true
});
layer.full(index); //正上方
layer.msg('灵活运用offset', {
offset: 0,
shift: 6
}); //还该列举什么呢
layer.msg('等我想想…');
案列实践
<a href="<?= url('/user/edit/' . $val->id) ?>" class="eve_edit" rel="popup2" title="会员资料修改" class="poplight" >资料修改</a>
<a href="<?= url('/user/frozen/' . $val->id ) ?>" title="选择冻结项" class="event_lock">冻结</a>
js代码书写
$('.eve_edit').click(function() {
oplayer = layer.open({
type: 2,
title: $(this).attr('title'),
shadeClose: true,
shade: false,
maxmin: true,
area: ['60%', '80%'],
content: $(this).attr('href')
});
return false;
});
jquery插件layer的更多相关文章
- jquery 弹窗插件 layer
jquery 弹窗插件 layer 官网:http://sentsin.com/jquery/layer/ 1 <!DOCTYPE html PUBLIC "-//W3C//DTD H ...
- 点击弹出 +1放大效果 -- jQuery插件
20140110更新: <!doctype html> <html> <head> <meta charset="UTF-8"> & ...
- 网站建设常用JQuery插件整理
1.jQuery.lazyload 作用:延迟加载网站图片,常用于电商网站.图片展示网站,对于提高网站打开速度比较有效. 2.Owl Carousel 作用:图片滚动特效.响应式传送带插件,特点是支持 ...
- 弹出框插件layer使用
layer是一款近年来备受青睐的web弹层组件,她具备全方位的解决方案,致力于服务各水平段的开发人员,您的页面会轻松地拥有丰富友好的操作体验. 插件官方地址:http://layer.layui.co ...
- 元素视差方向移动jQuery插件-类似github 404页面效果
原文地址:http://www.xuanfengge.com/shake.html 前言: 视差滚动,大家也许并不陌生.但是对于视差方向移动,你是否有见过效果呢?看官请进来瞧瞧~ demo : 轩枫阁 ...
- webpack 引入jquery和第三方jquery插件
1.引入jquery jQuery 直接在 html 中引入,然后在 webpack 中把它配置为全局即可. index.html: <!DOCTYPE html> <html> ...
- 移动端下滑刷新插件(jQuery插件)
由于在工作不能独自开发,而且为了给他们方便,自己写过不少的插件,不过今天刚好空闲,发出刚好完成的,移动端的下滑到底刷新插件.我不是很喜欢写插件给别人用,因为用起来自然是简单的,没什么难度,所以一起分享 ...
- js插件---layer.js使用体验是怎样
js插件---layer.js使用体验是怎样 一.总结 一句话总结:只有jquery和js,没有css,使用各种弹出层掉用各种函数特别方便,特别简单,特别好用. 引入只需要引入这两个,css都不需要, ...
- 自己写jquery插件之模版插件高级篇(一)
需求场景 最近项目改版中,发现很多地方有这样一个操作(见下图gif动画演示),很多地方都有用到.这里不讨论它的用户体验怎么样. 仅仅是从复用的角度,如果每个页面都去写text和select元素,两个b ...
随机推荐
- 【数据结构】最小生成树之prim算法和kruskal算法
在日常生活中解决问题经常需要考虑最优的问题,而最小生成树就是其中的一种.看了很多博客,先总结如下,只需要您20分钟的时间,就能完全理解. 比如:有四个村庄要修四条路,让村子能两两联系起来,这时就有最优 ...
- JS常用的设计模式(2)——简单工厂模式
简单工厂模式是由一个方法来决定到底要创建哪个类的实例, 而这些实例经常都拥有相同的接口. 这种模式主要用在所实例化的类型在编译期并不能确定, 而是在执行期决定的情况. 说的通俗点,就像公司茶水间的饮料 ...
- 浅谈前端与SEO
转载地址: https://blog.csdn.net/lzm18064126848/article/details/53385274?tdsourcetag=s_pctim_aiomsg SEO(S ...
- Windows未能启动 由于关键系统驱动程序丢失或损坏 电脑无法开机
该错误导致系统无法开机,其实也好解决 错误描述: Windows未能启动.原因可能是最近更改了硬盘或软件.解决此问题的步骤…… 1.…… 2.…… 3.…… …… 文件:\windows\system ...
- scss-@import
css有一个特别不常用的特性,即@import规则,它允许在一个css文件中导入其他css文件.然而,后果是只有执行到@import时,浏览器才会去下载其他css文件,这导致页面加载起来 特别慢. s ...
- SQL Server 2008 R2如何开启数据库的远程连接(转)
SQL Server 2008默认是不允许远程连接的,如果想要在本地用SSMS连接远程服务器上的SQL Server 2008,远程连接数据库.需要做两个部分的配置: SQL Server Manag ...
- javascript实现数据结构: 稀疏矩阵之三元组线性表表示
稀疏矩阵(Sparse Matrix):对于稀疏矩阵,目前还没有一个确切的定义.设矩阵A是一个n*m的矩阵中有s个非零元素,设 δ=s/(n*m),称δ为稀疏因子, 如果某一矩阵的稀疏因子δ满足δ≦ ...
- OPENCV VS设置
OPENCV VS设置 第一步 工程->工具->选项->VC++目录 第二步 这两项放到系统path下 D:\OpenCV2.4.3\VS\bin\Debug;D:\OpenCV2. ...
- 中值滤波C语言优化
中值滤波C语言优化 图像平滑是图像预处理的基本操作,本文首先用不同的方法对一张图片做预处理比较它们效果的不同,然后针对中值滤波,实现了一种快速实现.(其实是copy的opencv实现,呵呵).因为op ...
- iDempiere 使用指南 使用MRP进行生产及采购排程
Created by 蓝色布鲁斯,QQ32876341,blog http://www.cnblogs.com/zzyan/ iDempiere官方中文wiki主页 http://wiki.idemp ...