<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

</head>

<body>

<div class="div1" style="width:50px;border:1px solid #ddd;text-align:center">cc</div>

</body>

<script src="jquery-1.11.3.min.js"></script>

<script src="layer.js"></script>

<script>

    $(".div1").on("click",function(){

        var val=$(this).html();

        switch (val){

            case "aa":

                layer.open({

                    type: 1,

                    area: ['600px', '360px'],

                    shadeClose: true, //点击遮罩关闭

                    content: '\<\div style="padding:20px;">自定义内容\<\/div>'

                });

                break;

            case "bb":

                layer.open({

                    type: 2,

                    title: 'iframe父子操作',

                    maxmin: true,

                    shadeClose: true, //点击遮罩关闭层

                    area : ['600px' , '320px'],

                    content: 'iframe.html'

                });

                break;

            case "cc":

                layer.tips('Hello tips!', '.div1');

                break;

            default:

                layer.msg("666");

        }

    })

</script>

</html>

jq layer插件使用的更多相关文章

  1. jq分页插件

    jq分页插件 http://www.zhangxinxu.com/jq/pagination_zh/ html --------------- <tbody id="hiddenres ...

  2. 怎么用jq封装插件

    怎么用jq封装插件 以隔行变色为例 实现原理:1.找到表格的奇偶行,然后添加不同的class,激活行高亮显示也很简单,只要判断mouseover事件,然后添加一个class,mouseout的时候,再 ...

  3. layer插件layer.photos()动态插入的图片无法正常显示

    layer插件layer.photos()动态插入的图片无法正常显示,点击后面插入的图片,显示的是之前的图片列表,再次点击又是正常 有朋友遇到同样的问题 http://fly.layui.com/ji ...

  4. layer插件学习——弹框（自定义页）

    本文是自己整理的关于layer插件的弹框样式结果 介绍: 官方介绍:layer至今仍作为layui的代表作,受众广泛并非偶然,而是这五年多的坚持,不断完善和维护.不断建设和提升社区服务,使得猿们纷纷自 ...

  5. layer插件学习——提示层

    本文是自己整理的关于layer插件的提示层的结果 一.准备工作 下载jQuery插件和layer插件,并引入插件(注意:jQuery插件必须在layer插件之前引用) 百度云资源链接: jQuery插 ...

  6. layer插件学习——询问框

    本文是自己整理的关于layer插件的询问框样式结果 一.准备工作 下载jQuery插件和layer插件,并引入插件(注意:jQuery插件必须在layer插件之前引用) 百度云资源链接: jQuery ...

  7. layer插件学习——icon样式

    本文是自己整理的关于layer插件的icon样式结果 一.准备工作 下载jQuery插件和layer插件,并引入插件(注意:jQuery插件必须在layer插件之前引用) 百度云资源链接: jQuer ...

  8. 用jQuery Validate+layer插件实现好看的表单提交效果

    作为初学者,以前做表单验证都是自己写的,目的是让自己更好的了解代码,加深自己对javascript的理解,但是其实在很久都知道有一个很好用的表单验证插件:jQuery Validate.js,一直都没 ...

  9. layer插件open方法回掉值问题

    最近做项目需用到一个弹出层加载iframe页面的东西,首先想到layer插件,此插件用到过多次,兼容性很好,功能也强大,废话不多说上代码. 其实功能很简单,就是在目标页面选择一个值,回掉回来,说明一下 ...

随机推荐

  1. CString.Format

    Cstring str: str.Format("%d",num); d输出带符号十进制数 o输出无符号八进制数 x输出无符号十六进制数 u输出无符号数 c输出单个字符 s输出一串 ...

  2. BZOJ 2584: [Wc2012]memory（扫描线+线段树）

    题目链接:http://www.lydsy.com:808/JudgeOnline/problem.php?id=2584 题意:给出平面n个线段,任意两个线段严格不相交,且每个线段不平行于坐标轴.移 ...

  3. Java-基础编程（螺旋矩阵&乘法表）

    package cn.rick.study; import java.io.BufferedReader;import java.io.InputStreamReader;import java.ut ...

  4. FZU 2141 Sub-Bipartite Graph

    Sub-Bipartite Graph Time Limit:1000MS     Memory Limit:32768KB     64bit IO Format:%I64d & %I64u ...

  5. VS生成事件

    源自:http://www.cnblogs.com/FreeDong/p/3406737.html 如果说磨刀不误砍柴工,同样用好Visual Studio,会大大增加咱.NET程序猿效率.本文说的就 ...

  6. git学习笔记07-冲突了怎么办-那就解决冲突呗

    比如一个人自己创建了分支feature1进行修改提交之后提交,另一个人在master上修改然后提交. master分支和feature1分支各自都分别有新的提交,变成了这样: 这种情况下,Git无法执 ...

  7. php 上传文件。$_FILES

    <form name="article" method="post" enctype="multipart/form-data" ac ...

  8. How To Use API Online?

    Example: 在线 java8 api 1.http://docs.oracle.com/javase/8/docs/api/ 2.ctrl+f 3.输入类名! 4.

  9. JavaWeb学习总结（十三）--数据库连接池

    一.数据库连接池的概念 用池来管理Connection,这可以重复使用Connection.有了池,所以我们就不用自己来创建Connection,而是通过池来获取Connection对象.当使用完Co ...

  10. 【Todo】【读书笔记】大数据Spark企业级实战版 & Scala学习

    下了这本<大数据Spark企业级实战版>, 另外还有一本<Spark大数据处理:技术.应用与性能优化(全)> 先看前一篇. 根据书里的前言里面,对于阅读顺序的建议.先看最后的S ...