新手上路 layer弹层组件 (www.layui.com)

来源：互联网发布：大学c语言入门编辑：程序博客网时间：2024/05/16 17:09

官网：http://layer.layui.com/

例子：html代码

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>layer-更懂你的web弹窗解决方案</title>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
<script src="layer/layer.js"></script>

</head>
<body>

<button id="test2" class="button">运行上述例子</button>

<script>
//弹出一个页面层,只能放点击的后面，不能放到前面
$('#test2').on('click', function(){//点击事件

//如果要换其它效果，换了下面的内容就行
layer.open({
type: 1,
area: ['600px', '360px'],
shadeClose: true, //点击遮罩关闭
content: '\<\div style="padding:20px;">自定义内容\<\/div>'
});

//效果内容end
});
</script>
</body>
</html>

换其它弹出效果例子

//如果要换其它效果，换了下面的内容就行
//prompt层layer.prompt({ title: '输入任何口令，并确认', formType: 1 //prompt风格，支持0-2}, function(pass){ layer.prompt({title: '随便写点啥，并确认', formType: 2}, function(text){ layer.msg('演示完毕！您的口令：'+ pass +' 您最后写下了：'+ text); });});

//效果内容end
});
</script>

其它更多例子参考官网

0 0