JQuery浮动DIV提示信息并自动隐藏的代码


Posted in Javascript onAugust 29, 2010
/** 
* 浮动DIV定时显示提示信息,如操作成功, 失败等 
* @param string tips (提示的内容) 
* @param int height 显示的信息距离浏览器顶部的高度 
* @param int time 显示的时间(按秒算), time > 0 
* @sample <a href="javascript:void(0);" onclick="showTips( '操作成功', 100, 3 );">点击</a> 
* @sample 上面代码表示点击后显示操作成功3秒钟, 距离顶部100px 
* @copyright ZhouHr 2010-08-27 
*/ 
function showTips( tips, height, time ){ 
var windowWidth = document.documentElement.clientWidth; 
var tipsDiv = '<div class="tipsClass">' + tips + '</div>'; $( 'body' ).append( tipsDiv ); 
$( 'div.tipsClass' ).css({ 
'top' : height + 'px', 
'left' : ( windowWidth / 2 ) - ( tips.length * 13 / 2 ) + 'px', 
'position' : 'absolute', 
'padding' : '3px 5px', 
'background': '#8FBC8F', 
'font-size' : 12 + 'px', 
'margin' : '0 auto', 
'text-align': 'center', 
'width' : 'auto', 
'color' : '#fff', 
'opacity' : '0.8' 
}).show(); 
setTimeout( function(){$( 'div.tipsClass' ).fadeOut();}, ( time * 1000 ) ); 
}
Javascript 相关文章推荐
基于JQuery的asp.net树实现代码
Nov 30 Javascript
JSON格式的键盘编码对照表
Jan 29 Javascript
如何屏蔽防止别的网站嵌入框架代码
Aug 24 Javascript
jQuery对html元素的取值与赋值实例详解
Dec 18 Javascript
JavaScript实现点击文本自动定位到下拉框选中操作
Jun 15 Javascript
关于 angularJS的一些用法
Nov 29 Javascript
jQuery+CSS实现的table表格行列转置功能示例
Jan 08 jQuery
解决JavaScript中0.1+0.2不等于0.3问题
Oct 23 Javascript
ES6中Set和Map用法实例详解
Mar 02 Javascript
vue组件添加事件@click.native操作
Oct 30 Javascript
JavaScript中layim之整合右键菜单的示例代码
Feb 06 Javascript
JS原生实现轮播图的几种方法
Mar 23 Javascript
jQuery下的几个你可能没用过的功能
Aug 29 #Javascript
基于jquery的一个浮动框(扩展性比较好 )
Aug 27 #Javascript
Jquery+ajax请求data显示在GridView上(asp.net)
Aug 27 #Javascript
JQERY limittext 插件0.2版(长内容限制显示)
Aug 27 #Javascript
Jquery.TreeView结合ASP.Net和数据库生成菜单导航条
Aug 27 #Javascript
jquery 插件开发备注
Aug 27 #Javascript
Jquery + Ajax调用webService实例代码(asp.net)
Aug 27 #Javascript
You might like
利用discuz自带通行证整合dedecms的方法以及文件下载
2007/03/06 PHP
php中使用exec,system等函数调用系统命令的方法(不建议使用,可导致安全问题)
2012/09/07 PHP
YII模块实现绑定二级域名的方法
2014/07/09 PHP
PHP读取mssql json数据中文乱码的解决办法
2016/04/11 PHP
PHP培训要多少钱
2017/06/06 PHP
laravel框架使用FormRequest进行表单验证,验证异常返回JSON操作示例
2020/02/18 PHP
UserData用法总结 lanyu出品
2010/07/01 Javascript
Javascript算符的优先级介绍
2013/03/20 Javascript
javaScript的函数对象的声明详解
2015/02/06 Javascript
jQuery实现背景弹性滚动的导航效果
2016/06/01 Javascript
微信小程序 开发经验整理
2017/02/15 Javascript
webpack2.0搭建前端项目的教程详解
2017/04/05 Javascript
基于BootStrap实现简洁注册界面
2017/07/20 Javascript
Angularjs实现控制器之间通信方式实例总结
2018/03/27 Javascript
微信小程序实现蓝牙打印
2019/09/23 Javascript
如何在JavaScript中创建具有多个空格的字符串?
2020/02/23 Javascript
vue实现在线学生录入系统
2020/05/30 Javascript
[01:27:44]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Aster BO3 第一场 1月24日
2021/03/11 DOTA
详解Python操作RabbitMQ服务器消息队列的远程结果返回
2016/06/30 Python
打包发布Python模块的方法详解
2016/09/18 Python
python读取一个目录下所有txt里面的内容方法
2018/06/23 Python
django如何连接已存在数据的数据库
2018/08/14 Python
python实现感知器算法(批处理)
2019/01/18 Python
简单了解django orm中介模型
2019/07/30 Python
利用python计算时间差(返回天数)
2019/09/07 Python
Python class的继承方法代码实例
2020/02/14 Python
python 如何停止一个死循环的线程
2020/11/24 Python
解决CSS3的opacity属性带来的层叠顺序问题
2016/05/09 HTML / CSS
HTML5中meta属性的使用方法
2016/02/29 HTML / CSS
浙大毕业生自荐信
2014/01/26 职场文书
2014年两会学习心得体会
2014/03/10 职场文书
清明节网上祭英烈活动总结
2014/04/30 职场文书
感恩老师演讲稿600字
2014/08/28 职场文书
2014年禁毒工作总结
2014/11/24 职场文书
关于python中模块和重载的问题
2021/11/02 Python
Nginx的基本概念和原理
2022/03/21 Servers