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 ...
随机推荐
- Github-Q&A 常见错误排查(持续更新)
Q1:提交Git时出现"remote origin already exists"提示? 关联本地与网上仓库的时候,可能会出现此错误,这是因为已经存在已关联的仓库.通过如下方法 ...
- TensorFlow学习笔记(1)—— 基本概念与框架
入门框架时的常见问题 学习框架的原因? 方便.易用 学习框架的哪些知识点? 掌握一个项目的基本流程,就知道需要学习哪些知识点了 迅速学习框架的方法 根据项目每块流程的需要针对性的学 可以看官方的入门教 ...
- Linux下使用ip netns命令进行网口的隔离和配置ip地址
1. 添加隔离标记符: ip netns add fd 2. 将指定网卡放入隔离中: ip link set eth1 netns fd 3. 在隔离环境下执行命令: ip netns exec fd ...
- 【C#】上机实验三
实验1: 定义一个 TimePeiod 类 包含: hour , minute , second 实现时间的在 时分秒上的加法. using System; using System.Collecti ...
- spring boot使用@Aspect记录日志(请求参数,响应结果)
- 关于fastjson与jackson在反序列化bool型时的区别
背景 在测试中,两个项目a,b的接口参数用到了Bool类型,当传参"0",项目a通过了,项目b报错了,排查了下,项目b的那个接口,在对传参反序列化时就出现了问题,最后发现两个项目使 ...
- Oracle.EntityFrameworkCore使用时报错:Specified cast is not valid
我用的是:Oracle.EntityframeworkCore 2.19.30 如果看到报错:System.InvalidCastException:“Specified cast is not va ...
- tensorflow 单机多GPU训练时间比单卡更慢/没有很大时间上提升
使用tensorflow model库里的cifar10 多gpu训练时,最后测试发现时间并没有减少,反而更慢 参考以下两个链接 https://github.com/keras-team/keras ...
- Vscode配置springboot开发环境变量
先安装必要的插件 然后在左下角setting 打开setting 配置setting.json文件 ,主要是配置了用户设置 这里面主要配置jdk环境和maven,建议下载vscode推荐的openjd ...
- net 与或非
&& op1 && op2 当op1和op2都是true时,返回true :如果op1的值是false,则不运算右边的操作数 || op1 || op2 当op1和op ...