Bootstrap的js插件之警告框(alert.js)
data-dismiss="alert"——为关闭button加入该属性能够使其自己主动为警告框赋予关闭功能。
.fade .in——为警告框在关闭时加入动画效果。
很多其它细节參考演示样例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>js插件_警告框</title>
<link rel="stylesheet" href="bootstrap.min.css" type="text/css">
<!--<link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">-->
<script src="jquery-1.11.1.min.js"></script>
<script src="bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<h3>警告框演示样例</h3> <div class="alert alert-info alert-dismissible fade in" role="alert" id="myAlert">
<button type="button" class="close" data-dismiss="alert" aria-label="close">
<span aria-disabled="true">×</span>
</button>
感谢您选择<strong><要投哪></strong>
<button type="button" class="btn btn-primary">详情</button>
</div>
</div>
<script>
// $("#myAlert").alert('close');
// $('#myAlert').on('closed.bs.alert',function(e){
// alert("关闭了");
// })
</script> </body>
</html>
Bootstrap的js插件之警告框(alert.js)的更多相关文章
- Bootstrap历练实例:警告框(Alert)插件事件
事件 下表列出了警告框(Alert)插件中要用到的事件.这些事件可在函数中当钩子使用. 事件 描述 实例 close.bs.alert 当调用 close 实例方法时立即触发该事件. $('#myal ...
- Bootstrap历练实例:警告框(Alert)插件的方法
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- Bootstrap 警告框(Alert)插件
警告消息大多来是用来向终端用户提示警告或确认的消息,使用警告框插件,您可以向所有的警告框消息添加取消功能. 用法 您有以下两种方式启用警告框的可取消功能. 1.通过data属性:通过数据添加可取消功能 ...
- amazeui学习笔记--js插件(UI增强)--警告框Alert
amazeui学习笔记--js插件(UI增强)--警告框Alert 一.总结 1.警告框基本样式:用am-alert声明div容器, <div class="am-alert" ...
- 使用bootstrap的JS插件实现模态框效果
在上一篇文章中,我们使用 js+css 实现了模态框效果,在理解了模态框的基本实现方法和实现效果后,我们就要寻找更快捷的方法,又快又好的来完成模态框开发需求,从而节约时间,提高效率.一个好的轮子,不仅 ...
- 15 JavaScript弹窗(警告框alert、确认框confirm、提示框Promt)
警告框:window.alert().通常用于确认用户可以得到某些信息 <body> <script type="text/javascript" charset ...
- js插件编程-tab框
JS代码 (function (w) { //tab对象 function Tab(config) { //定义变量,防止变量污染 this.tabMenus=null; this.tabMains= ...
- 第二百四十六节,Bootstrap弹出框和警告框插件
Bootstrap弹出框和警告框插件 学习要点: 1.弹出框 2.警告框 本节课我们主要学习一下 Bootstrap 中的弹出框和警告框插件. 一.弹出框 弹出框即点击一个元素弹出一个包含标题和内容的 ...
- 使用bootstrap的插件实现模态框效果
在上一篇文章中,我们使用 js+css 实现了模态框效果,在理解了模态框的基本实现方法和实现效果后,我们就要寻找更快捷的方法,又快又好的来完成模态框开发需求,从而节约时间,提高效率.一个好的轮子,不仅 ...
随机推荐
- wpf,vb,位图剪裁的方法
‘ 貌似WPF对GDI+不提供支持,要达到剪裁图像的方法,可以使用image.clip,’不过clip只是对图片的一个遮挡拦截效果,并不改变本身的图片资源.‘下面的代码提供了剪裁图片资源的方法. Di ...
- Lua eval实现
因为loadstring总是在全局环境中编译它的串,所以编译出的函数访问的变量是全局变量.为了避免污染全局环境我们需要用setfenv修改函数的环境 function eval(equation, v ...
- Android,加载离线Android API文档缓慢问题!
解决方法:在host文件末添加如下信息! 0.0.0.0 www.googleapis.com 0.0.0.0 www.google.com 0.0.0.0 www.google-analytics. ...
- java 练习
class Hello{ public static void main(String [] args) { System.out.println(" Hello 这是我的第一个java作品 ...
- 【sqli-labs】 less9 GET - Blind - Time based. - Single Quotes (基于时间的GET单引号盲注)
加and http://localhost/sqli/Less-9/?id=1' and '1'='1%23 http://localhost/sqli/Less-9/?id=1' and '1'=' ...
- C# 写入二进制文件
写入整型25 文件在MiniHex中显示 写入字符串I am happy 0A 6D - 6D - 这一行数据是C#把字符串转换为16进制形式 不知道为啥用MiniHex打开多了个0A 写入空&quo ...
- apicloud常用分享方法
app中经常会有分享的功能,不管是分享商品还是文字还是图片或者是发送给微信好友扣扣好友,一下做一总结. 分享的样式(分享所有的样式模块):MNActionButton. 在apicloud 中添加这个 ...
- 使用.Net Core RT 标准动态库
这个文档可以引导你如何通过CoreRT生成一个原生标准的系统动态库让其他编程语言调用. CoreRT 可以构建静态库, 这些库可以在编译时链接或者也可以构建运行时所需的共享库, 创建一个支持CoreR ...
- position:搜索框显示历史浏览记录
absolute 生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位. 元素的位置通过 "left", "top", "righ ...
- GreenPlum 集群常用命令
GreenPlum 常用命令 gpstate 命令 参数 作用 gpstate -b => 显示简要状态 gpstate -c => 显示主镜像映射 gpstart -d => 指定 ...