// 在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弹出提示信息自动消失简洁版的更多相关文章

  1. jQuery弹出提示信息简洁版(自动消失)

    之前看了有一些现成的blockUI.Boxy.tipswindow等的jQuery弹出层插件,可是我的要求并不高,只需要在保存后弹出提示信息即可,至于复杂点的弹出层-可以编辑的,我是直接用bootst ...

  2. Jquery地图热点效果-鼠标经过弹出提示信息

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  3. jQuery弹出窗口完整代码

    jQuery弹出窗口完整代码 效果体验:http://keleyi.com/keleyi/phtml/jqtexiao/1.htm 1 <!DOCTYPE html PUBLIC "- ...

  4. 【如何使用jQuery】【jQuery弹出框】【jQuery对div进行操作】【jQuery对class,id,type的操作】【jquery选择器】

    1.如何使用jQuery jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架).jQuery设计的宗旨 ...

  5. Android N(7.0) 在ListView里显示EditText时软键盘弹出时会自动切换到全键盘的问题?

    Android N(7.0) 在ListView里显示EditText时软键盘弹出时会自动切换到全键盘的问题? 问题症状描述 Activity 在AndroidManifest.xml里设置andro ...

  6. thinkPHP5.0使用form表单提交数据和删除文章,不用TP的提示页面,使用弹出提示信息

    form表单提交数据和删除文章时,TP的默认信息提示页面的看起来不是很好看,想要实现弹窗提示怎么做呢? 前端:可以使用前端的一个知识--iframe,iframe元素会创建包含另外一个文档的内联框架: ...

  7. Bootstrap历练实例:弹出提示信息的样式按钮

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  8. Vue使用 weui picker 弹出框不消失

    前言 最近使用 weui 里面的 datepicker 组件的时候遇到了一个问题: 弹出来 选择年月日的框之后,直接点击导航上的“返回” 按钮,picker 选框不消失,也就是弹出框不消失 weui. ...

  9. jQuery弹出深色系层菜单

    低调奢华jQuery弹出层菜单,使用新版的jQuery库,兼容多种浏览器.Demo展示: http://hovertree.com/texiao/layer/3/ 本特效可以作为网站的引导页,使用jQ ...

随机推荐

  1. python基础 — 异常处理

    什么是异常? 异常即是一个事件,该事件会在程序执行过程中发生,影响了程序的正常执行. 一般情况下,在Python无法正常处理程序时就会发生一个异常. 异常是Python对象,表示一个错误. 当Pyth ...

  2. kali_Airmon-ng第一次渗透测试

    再看了一些资料之后,决定自己整理一下进行第一次测试,测试目标,自己宿舍的WIFI.教程仅供学习参考 断开kali连接的wifi,并检查网卡状态 airmon-ng 开启无线网卡的监控模式 airmon ...

  3. NEST routing timeout scroll

    /// <summary> /// PUT /employee/employee/9e5e50da-7740-488e-bee2-b24951435691?routing=test_rou ...

  4. js --策略模式

    策略模式的定义: 将算法一个个的单独进行封装,并且使他们可以相互替换.此模式让算法的变化不会影响到使用算法的客户. 先回顾一下,我们在做项目的过程中,是不是经常会遇见因为业务逻辑的关系,我们会写好多的 ...

  5. TweenMax—ScrambleText插件 实现类似电脑破译密码的特效

    首先贴一下TweenMax的中文网:https://www.tweenmax.com.cn/ 首先先展示一下最后的效果,需要的就继续看下去: 那团乱码是会一直变的 那么如何实现上图的效果呢??? 其实 ...

  6. React Native 开发豆瓣评分(六)添加字体图标

    添加依赖 yarn add react-native-vector-icons Link 依赖 react-native link react-native-vector-icons 使用默认字体图标 ...

  7. [转]关于ORA-00979 不是 GROUP BY 表达式错误的解释

    转自:https://www.cnblogs.com/vigarbuaa/archive/2012/06/25/2561225.html ORA-00979 不是 GROUP BY 表达式”这个错误, ...

  8. UCOSII软件定时器

    API函数 //创建 OS_TMR *OSTmrCreate (INT32U dly, INT32U period, INT8U opt, OS_TMR_CALLBACK callback, void ...

  9. [AIR] NativeExtension在IOS下的开发实例 --- 新建项目测试ANE(四)

    来源:http://bbs.9ria.com/thread-102043-1-1.html 通过前面的努力,好了,我们终于得到了一个ANE文件了.下面我们开始新建一个Flex Mobile项目做一下测 ...

  10. AIR面向IOS设备的原生扩展

    来源:http://www.cnblogs.com/alex-tech/archive/2012/03/22/2411264.html ANE组成部分 在IOS平台中,ANE的组成部分基本分为AS 3 ...