layer.js弹层的使用

soosgo

于 2020-08-25 10:07:44 发布

阅读量6.1k

点赞数

分类专栏： Bootstrap

本文链接：https://blog.csdn.net/Doulvme/article/details/108203766

版权

这篇博客介绍了layer.js的使用方法，包括基础参数、层类型、标题配置、内容设置以及不同类型的弹窗示例，如信息框、页面层、iframe层、加载层和tips层，提供了一种在项目中实现弹层效果的解决方案。

摘要由CSDN通过智能技术生成

由于layer可以独立使用，也可以通过Layui模块化使用。所以请按照你的实际需求来选择。

使用的时候注意：把下载下来的layer文件夹整个放在项目根目录下，省得layer内部引用文件位置出错。

场景	用前准备	调用方式
1. 作为独立组件使用	如果你只是单独想使用 layer，你可以去 layer 独立版本官网下载组件包。你需要在你的页面引入jQuery1.8以上的任意版本，并引入layer.js。	通过script标签引入layer.js后，直接用即可。参考：快速上手
2. layui 模块化使用	如果你使用的是 layui，那么你直接在官网下载 layui 框架即可，无需引入 jQuery 和 layer.js，但需要引入layui.css和layui.js	通过layui.use('layer', callback)加载模块

场景

用前准备

调用方式

1. 作为独立组件使用

如果你只是单独想使用 layer，你可以去 layer 独立版本官网下载组件包。你需要在你的页面引入jQuery1.8以上的任意版本，并引入layer.js。

通过script标签引入layer.js后，直接用即可。参考：快速上手

2. layui 模块化使用

如果你使用的是 layui，那么你直接在官网下载 layui 框架即可，无需引入 jQuery 和 layer.js，但需要引入layui.css和layui.js

通过layui.use('layer', callback)加载模块

一、消息弹窗默认3s自动消失

//引入好layer.js后，直接用即可
<script src="layer.js"></script>
<script>

关注

专栏目录