layer mobile弹层组件是为移动设备(手机、平板等webkit内核浏览器/webview)量身定做的弹层UI。

由于是采用原生 JavaScript编写,所以并不依赖任何第三方库。

layer mobile完全独立于PC版的layer,只需要按照场景选择使用即可。

官方文档  http://layer.layui.com/mobile/

使用步骤一:  下载该组件的相关文件

在上面链接下载该弹层组件(移动版),  解压下载包,保留下图圈起来的文件夹.

上面保留的文件夹下有layer.js和need文件夹下的layer.css,不要改变文件结构,如下:

使用步骤二:  在项目里面引入该组件

这个组件包含了js和css文件,但是在使用的时候只需要引入js文件(里面自动引入了css文件)

<script src="js/layer_mobile/layer.js"></script>   <!--这里是相对路径-->

引入之后,我们来测试一下是否成功引入 (直接复制官方文档的案例即可):

layer.open({
content: "Send success",
btn: 'confirm',
time: 2
});

该组件只有10KB左右 !

layer_mobile的简单使用的更多相关文章

  1. thinkphp 百度编辑器和layer简单用法

    百度编辑器1.4.3.3和layer插件简单案例 :后台单页面管理 增删改查操作 此处为默认图片保存路径,如果要修改保存路径,需要修改config文件. 添加页. <extend name=&q ...

  2. 【造轮子】打造一个简单的万能Excel读写工具

    大家工作或者平时是不是经常遇到要读写一些简单格式的Excel? shit!~很蛋疼,因为之前吹牛,就搞了个这东西,还算是挺实用,和大家分享下. 厌烦了每次搞简单类型的Excel读写?不怕~来,喜欢流式 ...

  3. Fabio 安装和简单使用

    Fabio(Go 语言):https://github.com/eBay/fabio Fabio 是一个快速.现代.zero-conf 负载均衡 HTTP(S) 路由器,用于部署 Consul 管理的 ...

  4. node.js学习(三)简单的node程序&&模块简单使用&&commonJS规范&&深入理解模块原理

    一.一个简单的node程序 1.新建一个txt文件 2.修改后缀 修改之后会弹出这个,点击"是" 3.运行test.js 源文件 使用node.js运行之后的. 如果该路径下没有该 ...

  5. 哪种缓存效果高?开源一个简单的缓存组件j2cache

    背景 现在的web系统已经越来越多的应用缓存技术,而且缓存技术确实是能实足的增强系统性能的.我在项目中也开始接触一些缓存的需求. 开始简单的就用jvm(java托管内存)来做缓存,这样对于单个应用服务 ...

  6. 在Openfire上弄一个简单的推送系统

    推送系统 说是推送系统有点大,其实就是一个消息广播功能吧.作用其实也就是由服务端接收到消息然后推送到订阅的客户端. 思路 对于推送最关键的是服务端向客户端发送数据,客户端向服务端订阅自己想要的消息.这 ...

  7. 我的MYSQL学习心得(一) 简单语法

    我的MYSQL学习心得(一) 简单语法 我的MYSQL学习心得(二) 数据类型宽度 我的MYSQL学习心得(三) 查看字段长度 我的MYSQL学习心得(四) 数据类型 我的MYSQL学习心得(五) 运 ...

  8. 使用 Nodejs 搭建简单的Web服务器

    使用Nodejs搭建Web服务器是学习Node.js比较全面的入门教程,因为要完成一个简单的Web服务器,你需要学习Nodejs中几个比较重要的模块,比如:http协议模块.文件系统.url解析模块. ...

  9. ASP.NET Aries 入门开发教程2:配置出一个简单的列表页面

    前言: 朋友们都期待我稳定地工作,但创业公司若要躺下,也非意念可控. 若人生注定了风雨飘摇,那就雨中前行了. 最机开始看聊新的工作机会,欢迎推荐,创业公司也可! 同时,趁着自由时间,抓紧把这系列教程给 ...

随机推荐

  1. python函数嵌套的实用技术

    def fun(): def fun1(): print () fun1() fun() fun1()#总结老男孩python里面讲过,这个是函数的嵌套,很有用, #效果就是给函数一个自己的小函数.然 ...

  2. Hibernate不能实时获取MySQL数据库的更新

    在hibernate.cfg.xml配置文件中,增加以下内容: <property name="hibernate.connection.provider_class"> ...

  3. kendo ui treeview 标题太长时的自动换行

    添加以下CSS即可: div.k-treeview{white-space: normal;}

  4. swagger core 和 swagger ui 如何关联【窥探】

    几个片段: package io.swagger.jaxrs.listing; import io.swagger.annotations.ApiOperation; import org.apach ...

  5. 使用idea,springboot,springsession,redis实现分布式微服务的session 共享

    本次开发环境:idea2016.3.4 +jdk1.8+maven3.3.9+redis+springboot+jedis 本文中的项目使用Maven来管理项目依赖,使用Spring Session和 ...

  6. 结对编程-四则运算生成器(java实现)

     结对伙伴:陈振华  项目要求 1.题目:实现一个自动生成小学四则运算题目的命令行程序. 2.需求: 1. 使用 -n 参数控制生成题目的个数 2. 使用 -r 参数控制题目中数值(自然数.真分数和真 ...

  7. 【TypeScript】TypeScript 学习 5——方法

    在 JavaScript 中,有两种方式定义方法. 1.命名的方法 function add(x,y){ return x+y; } 2.匿名方法 var myAdd = function(x,y) ...

  8. ASP.NET Core真实管道详解[1]

    ASP.NET Core管道虽然在结构组成上显得非常简单,但是在具体实现上却涉及到太多的对象,所以我们在 <ASP.NET Core管道深度剖析[共4篇]> 中围绕着一个经过极度简化的模拟 ...

  9. BitAdminCore框架应用篇:(一)使用Cookiecutter创建应用项目

      框架演示:http://bit.bitdao.cn 框架源码:https://github.com/chenyinxin/cookiecutter-bitadmin-core 一.简介 1.Coo ...

  10. Mongoose也是个大坑

    http://blog.csdn.net/qq_31280709/article/details/53900290 折腾了两个小时,MLGB居然是因为mongoose查询集合的时候自动加s后缀!!!