//样式部分

.message {

    position: fixed;top: -100px;width: 400px;left: 50%;margin-left: -200px;z-index: 1000;display: none;padding: 12px 0;text-align: center;color: #fff;background: #2196f3;
border-radius: 2px;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;-o-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;-webkit-transition: all 0.46s ease;
-moz-transition: all 0.46s ease;-o-transition: all 0.46s ease;transition: all 0.46s ease;
}
.messageShow {top: 6px;z-index: 2000;} //Body部分
<div class="message"></div> //JS部分
function messageShow() {

    var w = $('.message');

    w.addClass('messageShow');
} function messageHide() { var w = $('.message');
w.removeClass('messageShow').removeClass('messageShowNavFix');
w.html('');
} function messageOut() { var w = $('.message');
w.css('display', 'none');
} var t1, t2, t3;
function message(str) { var w = $('.message');
clearTimeout(t1);
clearTimeout(t2);
clearTimeout(t3); w.html(str);
w.css('display', 'block'); t1 = setTimeout("messageShow()", 80); t2 = setTimeout("messageHide()", 2500); t3 = setTimeout("messageOut()", 3000);
}

//应用部分,如:
$('.btn').click(function(){
  message("手机号不能为空,请输入手机号");
return;
});

message() 信息提示的更多相关文章

  1. html5的Message信息提示框

    1.定义dialog <dialog id="showDialog"> <div>您没有权限访问本页面!</div> </dialog&g ...

  2. jNotify:操作结果信息提示条

    我们在提交表单后,通过Ajax响应后台返回结果,并在前台显示返回信息,jNotify能非常优雅的显示操作结果信息.jNotify是一款基于jQuery的信息提示插件,它支持操作成功.操作失败和操作提醒 ...

  3. HubSpot – 网站开发必备的 jQuery 信息提示库

    HubSpot 一款功能丰富的 jQuery 消息提示插件.它可以帮助你个性化显示您的应用程序的事务性消息.您可以轻松地包裹 Ajax 请求进度,成功和错误消息,还可以添加操作链接到您的消息中. Hu ...

  4. Ext信息提示对话框

    Ext.window.MessageBox是一个工具类,他继承自Ext.window.Windoe对象,用来生成各种风格的信息提示对话框,其实例对象可以通过Ext.MessageBox或Ext.Msg ...

  5. Jquery 网站保存信息提示消息实现,提示后自动消失

    现在的大多数网站都有校验,以及信息提示:为了给用户更好的体验可以不用alert提示消息,采用jQuery提示完消息,自动消失 css <style> #tip_message { z-in ...

  6. AngularJS 表单数据验证及错误信息提示

    一.表单验证基本原理 表单验证包括两个主题: 定义验证规则,验证数据有效性. 显示验证结果,把验证结果以友好的方式显示给用户. H5内置一些验证功能,并会显示内置的错误提示信息,先要禁用它,在< ...

  7. Android SnackBar:你值得拥有的信息提示控件

    概述: Snackbar提供了一个介于Toast和AlertDialog之间轻量级控件,它能够非常方便的提供消息的提示和动作反馈. 有时我们想这样一种控件.我们想他能够想Toast一样显示完毕便能够消 ...

  8. 44. Ext信息提示对话框

    转自:https://www.cnblogs.com/glsqh/p/5920500.html Ext.window.MessageBox是一个工具类,他继承自Ext.window.Windoe对象, ...

  9. Day10-微信小程序实战-交友小程序-添加好友功能之创建并更新message信息

    1.首先要在 添加好友 这个按钮上添加一个事件,也就是在detail.wxml的添加好友这个按钮的哪里,添加一个点击事件 handleAddFriend 并且添加好友还要考虑,现在是已登陆状态还是未登 ...

随机推荐

  1. pytest框架(二)

    一.示例代码一 D:YOYO\ __init__.py test_class.py # content of test_class.py class TestClass: def test_one(s ...

  2. 12.Python略有小成(生成器,推导式,内置函数,闭包)

    Python(生成器,推导式,内置函数,闭包) 一.生成器初始 生成器的本质就是迭代器,python社区中认为生成器与迭代器是一种 生成器与迭代器的唯一区别,生成器是我们自己用python代码构建成的 ...

  3. Sublime Text 3 配置 sass

    先安装Sublime Text的sass 和 sass build插件, Sublime Text新建一个test.scss文件 $color: #369;  body {     backgroun ...

  4. html表格合并单元格的运用实例

    效果图: 实现代码: <!DOCTYPE html><html><head><meta charset="UTF-8"><ti ...

  5. Corn Fields(模板)

    题目链接 #include <stdio.h> #include <algorithm> #include <string.h> #include <iost ...

  6. IP服务-8-WCCP

    WCCP(网页缓存通信协议) 内容引擎负责将频繁访问的数据收集到本地,通常是HTTP流量,当主机访问相同页面时,可以直接通过内容引擎为主机提供相应内容,而无需通过WAN进行访问.WCCP与网页代理并不 ...

  7. linux 01 基础命令

    linux 01 基础命令 对于Linux要记住一个概念,一切皆文件,哪怕是目录,也是一个文件 1.修改用户密码 sudo passwd pyvip@Vip:~$ #pyvip表示用户名, Vip表示 ...

  8. HDU-1269-迷宫城堡(强连通 模板)

    链接:https://vjudge.net/problem/HDU-1269 题意: 为了训练小希的方向感,Gardon建立了一座大城堡,里面有N个房间(N<=10000)和M条通道(M< ...

  9. Jaspersoft Studio简介

    参考来源:https://community.jaspersoft.com/documentation/tibco-jaspersoft-studio-user-guide/v640/introduc ...

  10. MyBatis学习总结(二)---实例

    为了对MyBatis有个初步了解,现做一个简单的增.删.改.查实例.了解涉及的文件与相关作用. MySql创建friends表,以下是表的sql语句 DROP TABLE IF EXISTS `fri ...