jQuery弹出提示信息自动消失简洁版
// 在bootstrap中可以,可以使用如下方式实现弹出提示信息自动消失,如果没有使用bootstrap框架,可以自定义样式 //tip是提示信息,type:'success'是成功信息,'danger'是失败信息,'info'是普通信息,'warning'是警告信息
function ShowTip(tip, type) {
var $tip = $('#tip');
if ($tip.length == 0) {
// 设置样式,也可以定义在css文件中
$tip = $('<span id="tip" style="position:fixed;top:50px;left: 50%;z-index:9999;height: 35px;padding: 0 20px;line-height: 35px;"></span>');
$('body').append($tip);
}
$tip.stop(true).prop('class', 'alert alert-' + type).text(tip).css('margin-left', -$tip.outerWidth() / 2).fadeIn(500).delay(2000).fadeOut(500);
} function ShowMsg(msg) {
ShowTip(msg, 'info');
} function ShowSuccess(msg) {
ShowTip(msg, 'success');
} function ShowFailure(msg) {
ShowTip(msg, 'danger');
} function ShowWarn(msg, $focus, clear) {
ShowTip(msg, 'warning');
if ($focus) {
$focus.focus();
if (clear) $focus.val('');
}
return false;
}
效果图如下
3s后会自动消失,比原生的alert()体验更好
jQuery弹出提示信息自动消失简洁版的更多相关文章
- jQuery弹出提示信息简洁版(自动消失)
之前看了有一些现成的blockUI.Boxy.tipswindow等的jQuery弹出层插件,可是我的要求并不高,只需要在保存后弹出提示信息即可,至于复杂点的弹出层-可以编辑的,我是直接用bootst ...
- Jquery地图热点效果-鼠标经过弹出提示信息
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- jQuery弹出窗口完整代码
jQuery弹出窗口完整代码 效果体验:http://keleyi.com/keleyi/phtml/jqtexiao/1.htm 1 <!DOCTYPE html PUBLIC "- ...
- 【如何使用jQuery】【jQuery弹出框】【jQuery对div进行操作】【jQuery对class,id,type的操作】【jquery选择器】
1.如何使用jQuery jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架).jQuery设计的宗旨 ...
- Android N(7.0) 在ListView里显示EditText时软键盘弹出时会自动切换到全键盘的问题?
Android N(7.0) 在ListView里显示EditText时软键盘弹出时会自动切换到全键盘的问题? 问题症状描述 Activity 在AndroidManifest.xml里设置andro ...
- thinkPHP5.0使用form表单提交数据和删除文章,不用TP的提示页面,使用弹出提示信息
form表单提交数据和删除文章时,TP的默认信息提示页面的看起来不是很好看,想要实现弹窗提示怎么做呢? 前端:可以使用前端的一个知识--iframe,iframe元素会创建包含另外一个文档的内联框架: ...
- Bootstrap历练实例:弹出提示信息的样式按钮
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- Vue使用 weui picker 弹出框不消失
前言 最近使用 weui 里面的 datepicker 组件的时候遇到了一个问题: 弹出来 选择年月日的框之后,直接点击导航上的“返回” 按钮,picker 选框不消失,也就是弹出框不消失 weui. ...
- jQuery弹出深色系层菜单
低调奢华jQuery弹出层菜单,使用新版的jQuery库,兼容多种浏览器.Demo展示: http://hovertree.com/texiao/layer/3/ 本特效可以作为网站的引导页,使用jQ ...
随机推荐
- [转帖]【MySQL+keepalived】用keepalived实现MySQL主主模式的高可用
[MySQL+keepalived]用keepalived实现MySQL主主模式的高可用 https://www.jianshu.com/p/8694d07595bc 一.实验说明 MySQL主主模式 ...
- Prometheus入门到放弃(6)之AlertManager进阶
前面几个篇幅,我们介绍了alertmanger报警配置,在实际运维过程中,我们都会遇到,报警的重复发送,以及报警信息关联性报警.接下来我们就介绍下通过alertmanger对告警信息的收敛.一.告警分 ...
- Python 爬取陈都灵百度图片
Python 爬取陈都灵百度图片 标签(空格分隔): 随笔 今天意外发现了自己以前写的一篇爬虫脚本,爬取的是我的女神陈都灵,尝试运行了一下发现居然还能用.故把脚本贴出来分享一下. import req ...
- 利用Matlab实现PID控制仿真
该文转自博客园: https://www.cnblogs.com/kui-sdu/p/9048534.html %PID Controller clear, clc, close all; ts=0. ...
- python 读取环境变量
python 读取环境变量 前言 在使用python时候千万不要把账户密令直接写入脚本,特别是当你计划开源自己的作品时. 为了保护账户信息,你需要让脚本从环境中导入敏感信息. 读取方法 import ...
- 面试6 --- 当List<String> list =new ArrayList<String>(20); 他会扩容多少次
当List<String> list =new ArrayList<String>(20); 他会扩容多少次?A 0 B 1 C 2 D 3答案是A: 因为这个集合 ...
- activiti串行会签的使用
1.串行任务的配置 2.当任务走到串行会签节点时,会从你之前保存的流程变量中找集合(我这里设置的assigneeList),串行会签会根据这个集合设置一系列该节点的流程变量 3.结束条件的设置,若满足 ...
- Java文件字符流
1.字符编码(Character encoding)和编码集(Character set) 字符编码(Character encoding)是将字符转为字节或字节数组的过程. 字符集(Characte ...
- 全面学习 Python 包:包的构建与分发
首发于公众号:Python编程时光 1. 为什么需要对项目分发打包? 平常我们习惯了使用 pip 来安装一些第三方模块,这个安装过程之所以简单,是因为模块开发者为我们默默地为我们做了所有繁杂的工作,而 ...
- python 数据类型 常用法方
python 数据类型 常用法方 upper() 大写 str lower() 小写 str strip() rstrip() lstrip() 去除字符两边的空格 去右边 左边空白 str repl ...