Bootstrap编程式对话框插件bootprompt.js
源码介绍
bootprompt.js是一款ootstrap编程式对话框插件。该插件为原生的bootstrap提供模态对话框扩展功能,可以以编程的方式实现各种对话框效果,支持bootstrap3和bootstrap4。 在页面中引入下面的文件。 最基本的使用方法如下。 bootprompt.js插件的github网址为:https://github.com/lddubeau/bootprompt简要教程
使用方法
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
<script src="js/jquery-1.11.0.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootprompt.all.min.js"></script>
HTML结构
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>My page</title>
<!-- CSS dependencies -->
<link rel="stylesheet" type="text/css" href="bootstrap.min.css">
</head>
<body>
<p>Content here. <a class="show-alert" href=#>Alert!</a></p>
<!-- JS dependencies -->
<script src="js/jquery/1.12.4/jquery.min.js"></script>
<!-- Bootstrap 4 dependency -->
<script src="popper.min.js"></script>
<script src="bootstrap.min.js"></script>
<!-- bootprompt code -->
<script src="bootprompt.min.js"></script>
<script src="bootprompt.locales.min.js"></script>
<script>
$(document).on("click", ".show-alert", function(e) {
bootprompt.alert("Hello world!", function() {
console.log("Alert Callback");
});
});
</script>
</body>
</html>
本站资源均来自互联网,仅供研究学习,禁止违法使用和商用,产生法律纠纷本站概不负责!如果侵犯了您的权益请与我们联系!
转载请注明出处: 免费源码网-免费的源码资源网站 » Bootstrap编程式对话框插件bootprompt.js
发表评论 取消回复