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 ...
随机推荐
- STS,修改Ctrl+Shift+R匹配类的配置
在使用STS(Spring Tools)时,每次通过Ctrl+Shift+R查询类时,会出来一堆不想看到的类.如下所示: 上面的.class文件和父项目中的.java文件,在匹配类时,是不想看到的. ...
- 通过Anaconda安装的jupyter notebook,打开时,未能启动默认浏览器
问题:通过Anaconda安装的jupyter notebook,通过开始菜单的快捷方式打开时,未能启动网页,需要复制url,粘贴到浏览器中才会出现工作面板. 解决方法: 修改jupyter_note ...
- Bootstrap-table 使用总结,和其参数说明
转载于:https://www.cnblogs.com/laowangc/p/8875526.html 一.什么是Bootstrap-table? 在业务系统开发中,对表格记录的查询.分页.排序等处理 ...
- Socket HttpListen
HttpListener sSocket = new HttpListener(); sSocket.Prefixes.Add("http://127.0.0.1:8080/"); ...
- 【洛谷 P4302】 [SCOI2003]字符串折叠(DP)
题目链接 简单区间dp 令\(f[i][j]\)表示\([i,j]\)的最短长度 先枚举区间,然后在区间中枚举长度\(k\),看这个区间能不能折叠成几个长度为\(k\)的,如果能就更新答案. #inc ...
- pytest用例传参的多种方式
1.接收外部传参 *函数获取需要的参数,再传入 *函数获登录信息,直接使用 2.其它方式传参 *依据dict取值 *tuple数组
- pc,h5端动态设置style
<p class="plan" :style="'width:' + unit"></p>
- HTTP缓存字段总结
首部 通用首部:有些首部提供了与报文相关的最基本的信息,它们被称为通用首部. 请求首部:请求首部是只在请求报文中有意义的首部. 响应首部 实体首部: 用来描述HTTP报文的负荷,由于请求和响应报文中都 ...
- excel2016打开为空白界面解决办法
前言 excel2016打开文件为空白的界面,明显不正常. 解决方法 https://blog.csdn.net/b2345012/article/details/94134401 以上.
- SpringBoot学习之@Configuration注解和@Bean注解
@Configuration 1.@Configuration注解底层是含有@Component ,所以@Configuration 具有和 @Component 的作用. 2.@Configurat ...