http://layer.layui.com

第一节:layer.alert()弹窗的用法

1、解压layer-v2.2.zip压缩包

2、拷贝layer文件夹到实战项目目录

3、注意:layer.js是依赖jquery的,所以需要写上以下两行代码

<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="js/layer/layer.js"></script>

4、layer文件夹中的css文件在skin目录中,但这里面的两个css文件无需引用,只需引入layer.js,它自动会引用这两个css文件给弹窗加上样式,

但前提是,目录结构是固定的layer.js同级的是skin目录才行,因为这时layer.js的引用路径,不能变。

5、实战代码:

......

if(num==0||num>140){
            layer.alert('不符合发布要求,请检查', {//第一个参数是提示文本
                skin: 'layui-layer-lan'//蓝色外框皮肤
                ,closeBtn: 0//没有关闭按钮
                ,shift: 5 //动画类型,为5的动画效果不突兀,动画效果类型还可以是1,2,3,4,....
            });
//          alert("不符合发布要求,请检查");
        }else{
            layer.alert('发布成功', {
                skin: 'layui-layer-lan'
                ,closeBtn: 0
                ,shift: 5 //动画类型
            });
//          alert("发布成功");

......

layer弹窗插件实战用法小结1—— layer.alert()的更多相关文章

  1. layer弹窗插件留言提交

    function msgShow(getname,getuserid){ layer.open({ type: 1 //此处以iframe举例 ,title: '收件人:'+getname+'(ID: ...

  2. layer弹窗插件自带自写经验

    复制可下载源代码和自写教程    链接: https://pan.baidu.com/s/1mhHa5Os 密码: j5su

  3. vue弹窗插件实战

    vue做移动端经常碰到弹窗的需求, 这里写一个功能简单的vue弹窗 popup.vue <template> <div class="popup-wrapper" ...

  4. jQuery Colorbox弹窗插件使用教程小结、属性设置详解

    jQuery Colorbox是一款弹出层,内容播放插件,效果极佳,当然我主要是用来弹出图片啦. jQuery Colorbox不仅有弹性动画效果,淡入淡出效果,幻灯片播放,宽度自定义,还能够ajax ...

  5. jQuery Colorbox弹窗插件使用教程小结、属性设置详解以及colorbox关闭

    jQuery Colorbox是一款弹出层,内容播放插件,效果极佳,当然我主要是用来弹出图片啦. jQuery Colorbox不仅有弹性动画效果,淡入淡出效果,幻灯片播放,宽度自定义,还能够ajax ...

  6. jquery弹窗插件layer:layer.layui.com

    这两天在做抽奖转盘功能,浏览器自带的alert弹出框太low,本人又基本不会前端, 于是借鉴前人用fancybox插件做的效果 结果没看懂其写法(http://www.0101shop.com/goo ...

  7. 弹窗插件layer

    layer的插件的地址:http://layer.layui.com/简单使用: layer.open({ type: , //page层 area: ['500px', '300px'], titl ...

  8. 使用layer弹窗和layui表单做新增功能

    注释:代码参考http://blog.51cto.com/825272560/1891158,在其修改之上而来,在此感谢! 1.需求:使用layer在弹窗内完成新增,成功后提示并刷新页面(父页面,li ...

  9. jquery 弹窗插件 layer

    jquery 弹窗插件 layer 官网:http://sentsin.com/jquery/layer/ 1 <!DOCTYPE html PUBLIC "-//W3C//DTD H ...

随机推荐

  1. Android ART运行时无缝替换Dalvik虚拟机的过程分析

    Android ART运行时无缝替换Dalvik虚拟机的过程分析 分类: Android2014-01-13 00:59 42722人阅读 评论(66) 收藏 举报 AndroidARTDalvikV ...

  2. 判断android文件是否加壳

    判断android文件是否加壳 查看文件是否有多个进程 反编译文件class.dex,看文件结构 查看文件特征,libsecexe libsecmain等 反编译so文件,看函数是否加密

  3. (转)MultipleOutputFormat和MultipleOutputs

    MultipleOutputFormat和MultipleOutputs http://www.cnblogs.com/liangzh/archive/2012/05/22/2512264.html ...

  4. 原创:运行loadtest时报错the load test results repository was created with a previous version and is not compatible

    如果run setting中的Storage Type设置为DataBase,则需要设置数据库来保存loadtest的运行结果,如下图所示 图:Storage Type设置为DataBase 图:在M ...

  5. extjs入门

    http://blog.csdn.net/xiebaochun/article/details/36414437

  6. CodeForces 606B Testing Robots

    模拟,题意看了一小时 /* *********************************************** Author :Zhou Zhentao Email :774388357@ ...

  7. PHP学习笔记-session

    session 在windows中的默认保存在AppDate/Local/Temp

  8. PHP学习笔记-1——快捷键

    整行删除 ctrl+E set get 生成 alt+ insert 查找.搜索和替换 Ctrl-F3 搜索位于插入点的词 F3/Shift-F3 在文件中查找下一个/上一个 Ctrl-F/H 在文件 ...

  9. android测试之——mokeyrunner上(二)

    以下是本人原创,如若转载和使用请注明转载地址.本博客信息切勿用于商业,可以个人使用,若喜欢我的博客,请关注我,谢谢!博客地址 感谢您支持我的博客,我的动力是您的支持和关注!如若转载和使用请注明转载地址 ...

  10. linux日常巡检脚本

    ######################以下是脚本内容开始部分###################################### #!/bin/bash #set -x2012-02-2 ...