message() 信息提示
//样式部分
.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() 信息提示的更多相关文章
- html5的Message信息提示框
1.定义dialog <dialog id="showDialog"> <div>您没有权限访问本页面!</div> </dialog&g ...
- jNotify:操作结果信息提示条
我们在提交表单后,通过Ajax响应后台返回结果,并在前台显示返回信息,jNotify能非常优雅的显示操作结果信息.jNotify是一款基于jQuery的信息提示插件,它支持操作成功.操作失败和操作提醒 ...
- HubSpot – 网站开发必备的 jQuery 信息提示库
HubSpot 一款功能丰富的 jQuery 消息提示插件.它可以帮助你个性化显示您的应用程序的事务性消息.您可以轻松地包裹 Ajax 请求进度,成功和错误消息,还可以添加操作链接到您的消息中. Hu ...
- Ext信息提示对话框
Ext.window.MessageBox是一个工具类,他继承自Ext.window.Windoe对象,用来生成各种风格的信息提示对话框,其实例对象可以通过Ext.MessageBox或Ext.Msg ...
- Jquery 网站保存信息提示消息实现,提示后自动消失
现在的大多数网站都有校验,以及信息提示:为了给用户更好的体验可以不用alert提示消息,采用jQuery提示完消息,自动消失 css <style> #tip_message { z-in ...
- AngularJS 表单数据验证及错误信息提示
一.表单验证基本原理 表单验证包括两个主题: 定义验证规则,验证数据有效性. 显示验证结果,把验证结果以友好的方式显示给用户. H5内置一些验证功能,并会显示内置的错误提示信息,先要禁用它,在< ...
- Android SnackBar:你值得拥有的信息提示控件
概述: Snackbar提供了一个介于Toast和AlertDialog之间轻量级控件,它能够非常方便的提供消息的提示和动作反馈. 有时我们想这样一种控件.我们想他能够想Toast一样显示完毕便能够消 ...
- 44. Ext信息提示对话框
转自:https://www.cnblogs.com/glsqh/p/5920500.html Ext.window.MessageBox是一个工具类,他继承自Ext.window.Windoe对象, ...
- Day10-微信小程序实战-交友小程序-添加好友功能之创建并更新message信息
1.首先要在 添加好友 这个按钮上添加一个事件,也就是在detail.wxml的添加好友这个按钮的哪里,添加一个点击事件 handleAddFriend 并且添加好友还要考虑,现在是已登陆状态还是未登 ...
随机推荐
- pytest框架(二)
一.示例代码一 D:YOYO\ __init__.py test_class.py # content of test_class.py class TestClass: def test_one(s ...
- 12.Python略有小成(生成器,推导式,内置函数,闭包)
Python(生成器,推导式,内置函数,闭包) 一.生成器初始 生成器的本质就是迭代器,python社区中认为生成器与迭代器是一种 生成器与迭代器的唯一区别,生成器是我们自己用python代码构建成的 ...
- Sublime Text 3 配置 sass
先安装Sublime Text的sass 和 sass build插件, Sublime Text新建一个test.scss文件 $color: #369; body { backgroun ...
- html表格合并单元格的运用实例
效果图: 实现代码: <!DOCTYPE html><html><head><meta charset="UTF-8"><ti ...
- Corn Fields(模板)
题目链接 #include <stdio.h> #include <algorithm> #include <string.h> #include <iost ...
- IP服务-8-WCCP
WCCP(网页缓存通信协议) 内容引擎负责将频繁访问的数据收集到本地,通常是HTTP流量,当主机访问相同页面时,可以直接通过内容引擎为主机提供相应内容,而无需通过WAN进行访问.WCCP与网页代理并不 ...
- linux 01 基础命令
linux 01 基础命令 对于Linux要记住一个概念,一切皆文件,哪怕是目录,也是一个文件 1.修改用户密码 sudo passwd pyvip@Vip:~$ #pyvip表示用户名, Vip表示 ...
- HDU-1269-迷宫城堡(强连通 模板)
链接:https://vjudge.net/problem/HDU-1269 题意: 为了训练小希的方向感,Gardon建立了一座大城堡,里面有N个房间(N<=10000)和M条通道(M< ...
- Jaspersoft Studio简介
参考来源:https://community.jaspersoft.com/documentation/tibco-jaspersoft-studio-user-guide/v640/introduc ...
- MyBatis学习总结(二)---实例
为了对MyBatis有个初步了解,现做一个简单的增.删.改.查实例.了解涉及的文件与相关作用. MySql创建friends表,以下是表的sql语句 DROP TABLE IF EXISTS `fri ...