Jquery 网站保存信息提示消息实现,提示后自动消失
现在的大多数网站都有校验,以及信息提示:为了给用户更好的体验可以不用alert提示消息,采用jQuery提示完消息,自动消失
css
<style>
#tip_message {
z-index:;
position: fixed;
left:;
top: 40%;
text-align: center;
width: 100%;
} #tip_message span {
background-color: #03C440;
opacity: .8;
padding: 20px 50px;
border-radius: 5px;
text-align: center;
color: #fff;
font-size: 20px;
} #tip_message span.error {
background-color: #EAA000;
}
</style>
javascript代码如下:
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){ //提示成功信息
ShowSuccessMessage = function(message, life) {
var time = 3000;
if (!life) {
time = life;
} if ($("#tip_message").text().length > 0) {
var msg = "<span>" + message + "</span>";
$("#tip_message").empty().append(msg);
} else {
var msg = '<div id="tip_message"><span>' + message + "</span></div>";
$("body").append(msg);
} $("#tip_message").fadeIn(time);
$("#tip_message").fadeOut(time); }; //提示错误信息
ShowErrorMessage = function(message, life) {
ShowSuccessMessage(message, life);
$("#tip_message span").addClass("error");
}; ShowSuccessMessage("Hello success!", 1000); // 第二个参数life是指消息显示时间
//ShowErrorMessage("Hello error!", 1000);
}); </script>
Jquery 网站保存信息提示消息实现,提示后自动消失的更多相关文章
- Axure实现提示文本单击显示后自动消失的效果
Axure实现提示文本单击显示后自动消失的效果 方法/步骤 如图所示,框出的部分为提示文本(已经命名为tooltip),希望达到的效果是默认加载时不显示,点击帮助图标后显示,且2秒后自动消失. ...
- axure如何实现提示框3s后自动消失
本示例基于axure8 实现 1.先做两个元件,一个按钮,一个提示框 2.将弹框“发布成功提示”设置为,页面载入时隐藏,这样预览页面时,该弹框是隐藏状态 3.给按钮添加交互样式,如下: 4.预览,点击 ...
- jquery 提示信息显示后自动消失的具体实现
方法一: 复制代码 代码如下: $("#errormsg").html("您的信息输入错误,请重试!").show(300).delay(3000).hide( ...
- jQuery在HTML文档加载完毕后自动执行某个事件;
原来onchange=“fucntionname(parms)”: <select name="country" id="selCountries_{$sn}&qu ...
- 示例:WPF中自定义MessageService应用DialogHost、Snackbar、NotifyIcon显示各种场景提示消息
原文:示例:WPF中自定义MessageService应用DialogHost.Snackbar.NotifyIcon显示各种场景提示消息 一.目的:不同交互场景需要提示不同的消息,不同的消息需要用不 ...
- jQuery动态提示消息框效果
效果预览:http://keleyi.com/keleyi/phtml/jqtexiao/2.htm 原文:http://keleyi.com/a/bjac/hxv86dyi.htm <!DOC ...
- jQuery实现鼠标移到元素上动态提示消息框效果
当光标移动到某些元素上时,会弹出像tips的提示框,这种效果想必大家都有见到过吧,下面有个不错的示例,大家可以感受下 当光标移动到某些元素上时,会弹出像tips的提示框. 复制代码代码如下: < ...
- 一款基于jquery超炫的弹出层提示消息
今天给大家带来一款基于jquery超炫的弹出层提示消息.这款实例页面初始时,一个go按钮.当单击go按钮时,提示强出层以动画形式出现.效果图如下: 在线预览 源码下载 实现的代码. html代码: ...
- jquery提示消息,简单通用
jquery提示消息.简单通用 function showTips(txt,time,status) { var htmlCon = ''; if(txt != ''){ if(status != 0 ...
随机推荐
- OpenSSL初瞻及本系列的博文的缘由
OpenSSL初瞻及本系列的博文的缘由1.为什么要写关于“OpenSSL源码分析与学习笔记”系列博文?非常重要的两个原因是Heartbleed和学校课程.我虽然是一个非常崇尚自学的人但是并不代表我不擅 ...
- 转:Spine.JS+Rails重客户端Web应用技术选型思路:『风车』架构设计
原文来自于:http://www.infoq.com/cn/articles/fengche-co-architecture 风车这个项目开始于 2011 年 11 月份,之前叫做 Pragmatic ...
- smart pointer (auto_ptr)
很多人听说过标准auto_ptr智能指针机制,但并不是每个人都天天使用它.这真是个遗憾,因为auto_ptr优雅地解决了C++设计和编码中常见的问题,正确地使用它可以生成健壮的代码.本文阐述了如何正确 ...
- keep out layer PK board shape
在进行设计pcb时,注意:板边线只能用PLACE LINE画线条,不能画具有电气性能的导线关于边界设置有三种,一.在 keepout layer 定义电气边界.二.design->board s ...
- How to make vcredist_x86 reinstall only if not yet installed
Since you don't want to tell what minimal version of Visual C++ redistributable package you require, ...
- [React] React Router: Route Parameters
A router library is no good if we have to hardcode every single route in our application. In this le ...
- [Redux] Implementing combineReducers() from Scratch
The combineReducers function we used in previous post: const todoApp = combineReducers({ todos, visi ...
- CentOS6.x升级MySQL版本号5.1到5.6
有一些虚拟机.云主机提供商仍然使用的是老版本号的安装套件. 预装的应用软件版本号非常低. 比方 techbrood.com 使用的云server,当中MySQL预装版本号为老版本号5.1.x. 而最新 ...
- .NET2.0下的对象生成JSON数据
前言:今天研究了下在.NET2.0环境下开发Ajax程序经常用到的一个数据类型JSON, 一.什么是JSON? 自己也写不了句子不是很专业,下面是百度百科的关于JSON的介绍: JSON(JavaSc ...
- 酷Q机器人,QQ机器人使用教程
软件介绍: 酷Q,软件酷Q机器人是一款基于webqq开发的一款自动接收.处理qq消息的软件. 改程序使用易语言编写,精简大量不必要代码,减小了软件体积,优化程序速度,使得酷Q更加轻巧好用. 在消息处理 ...