JQuery 浮动DIV显示提示信息并自动隐藏
/**
* 浮动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 ) );
}
原文:http://www.cnblogs.com/showblog/archive/2010/08/27/1810427.html
JQuery 浮动DIV显示提示信息并自动隐藏的更多相关文章
- 基于JQuery的浮动DIV显示提示信息并自动隐藏
/** * 浮动DIV定时显示提示信息,如操作成功, 失败等 * @param string tips (提示的内容) * @param int height 显示的信息距离浏览器顶部的高度 * @p ...
- div显示提示信息
div显示提示信息 <body> <style type="text/css"> a.link{position:relative;} a.link div ...
- div显示提示信息【转】
div显示提示信息 <body> <style type="text/css"> a.link{position:relative;} a.link div ...
- JQuery判断div(控件)是否为隐藏
以下是JavaScript 中判断div是否为隐藏代码引用片段: if (div.style.display == "none") { div.style.display = &q ...
- jQuery鼠标悬停显示提示信息窗体
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 使用jquery点击一个实现button或连接,进行以下div显示,在点击隐藏
jquery代码: <script type="text/javascript" src="js/jquery-1.7.2.js"></scr ...
- jQuery 点击显示再次点击隐藏
<html> <head> <script type="text/javascript" src="/jquery/jquery.js&qu ...
- HTML 最简单的tips 怎么支持指定DIV显示提示信息
<body> <style type="text/css"> a.link{position:relative;} a.link div.tips{ bor ...
- jquery 浮动 固定显示
<%@ page contentType="text/html;charset=UTF-8" language="java" %>无标题文档 我爱b ...
随机推荐
- [REPRINT]MODIFYING USER ACCOUNTS(usermod)
http://landoflinux.com/linux_usermod_command.html Append Additional Groups to an exiting account use ...
- Delphi 字符串函数StrUtils单元AnsiLeftStr、AnsiRightStr、AnsiMidStr、AnsiContainsStr、AnsiContainsText、AnsiStartsStr、AnsiStartsText、AnsiEndsStr、AnsiEndsText、AnsiReplaceStr、AnsiReplaceText、AnsiResemblesText...
引用单元 StrUtils 非 SysUtilsAnsiLeftStr.AnsiRightStr.AnsiMidStr.AnsiContainsStr.AnsiContainsText.AnsiSta ...
- vue中使用iview表单验证时this指针问题
需求 使用iview,在提交时对值b进行验证,使其不能大于值a 实现 <Form ref="config" :model="config" :rules= ...
- Service系统服务(一):安装一个KVM服务器、KVM平台构建及简单管理、virsh基本管理操作、xml配置文件的应用、为虚拟机制作快照备份、快建新虚拟机
一.安装一个KVM服务器 目标: 本例要求准备一台 RHEL7.2 服务器,将其搭建为KVM平台,主要完成下列操作: 1> 关闭本机的SELinux保护.防火墙服务 2> 挂载RHEL ...
- paper 139:qt超强绘图控件qwt - 安装及配置
qwt是一个基于LGPL版权协议的开源项目, 可生成各种统计图.它为具有技术专业背景的程序提供GUI组件和一组实用类,其目标是以基于2D方式的窗体部件来显示数据, 数据源以数值,数组或一组浮点数等方式 ...
- svn提交代码失败提示清理(清理失败并且报错信息乱码解决办法)
原因是;svn的数据库队列原因 1,下载sqlite3.exe, sqlite官网http://www.sqlite.org/download.html) 2.在Windows的D盘中新建tools ...
- 【消息中间件】kafka
一.kafka整体架构 kafka是一个发布订阅模式的消息队列,生产者和消费者是多对多的关系,将发送者与接收者真正解耦: 生产者将消息发送到broker: 消费者采用拉(pull)模式订阅并消费消息: ...
- java.lang.IllegalAccessException: Class XXXcan not access xxx with modifiers "private"
field 或者 method 是 provate的 field.setAccessible(true); method.setAccessible(true); 有时候是因为 newinstance ...
- laravel生成key
安装laravel之后要设置一个随即字符串作为应用密钥(key),如果你是通过composer或者laravel安装器安装的 这个key已经自动生成并设置了. 一般情况下这个key为32位长度字符串. ...
- promise基础用法
/** * Created by liyinghao on 2016/11/6. */ const fs = require('fs'); /* * 新建一个Promise对象,Promise就是一个 ...