/** 
* 浮动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显示提示信息并自动隐藏的更多相关文章

  1. 基于JQuery的浮动DIV显示提示信息并自动隐藏

    /** * 浮动DIV定时显示提示信息,如操作成功, 失败等 * @param string tips (提示的内容) * @param int height 显示的信息距离浏览器顶部的高度 * @p ...

  2. div显示提示信息

    div显示提示信息 <body> <style type="text/css"> a.link{position:relative;} a.link div ...

  3. div显示提示信息【转】

    div显示提示信息 <body> <style type="text/css"> a.link{position:relative;} a.link div ...

  4. JQuery判断div(控件)是否为隐藏

    以下是JavaScript 中判断div是否为隐藏代码引用片段: if (div.style.display == "none") { div.style.display = &q ...

  5. jQuery鼠标悬停显示提示信息窗体

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. 使用jquery点击一个实现button或连接,进行以下div显示,在点击隐藏

    jquery代码: <script type="text/javascript" src="js/jquery-1.7.2.js"></scr ...

  7. jQuery 点击显示再次点击隐藏

    <html> <head> <script type="text/javascript" src="/jquery/jquery.js&qu ...

  8. HTML 最简单的tips 怎么支持指定DIV显示提示信息

    <body> <style type="text/css"> a.link{position:relative;} a.link div.tips{ bor ...

  9. jquery 浮动 固定显示

    <%@ page contentType="text/html;charset=UTF-8" language="java" %>无标题文档 我爱b ...

随机推荐

  1. mysql查询表的创建时间

    mysql查询表的创建时间 查询语句: SELECT table_name,create_time FROM information_schema.TABLES;

  2. 【leetcode】435. Non-overlapping Intervals

    题目如下: Given a collection of intervals, find the minimum number of intervals you need to remove to ma ...

  3. Centos MySQL 5.7安装、升级教程

    MySQL 5.7安装.升级笔记分享: 卸载当前的 MySQL 查看当前 MySQL 版本: ? 1 2 [root@coderknock ~]# mysql -V mysql Ver 14.14 D ...

  4. shell脚本编程测试类型下

    一bash的数值测试 -v VAR变量VAR是否设置 数值测试:-gt 是否大于greater-ge 是否大于等于-eq 是否等于-ne 是否不等于  not equal-lt 是否小于-le 是否小 ...

  5. Python--数据类型与变量(列表、元祖、字典)

    今天我们来看Python中3种內建的数据结构:列表.元祖和字典 列表 定义:[]内以逗号分隔,按照索引,存放各种数据类型,每个位置代表一个元素特性:1.可存放多个值2.可修改指定索引位置对应的值,可变 ...

  6. 初识sed和gwak

    一.sed编辑器 sed命令的格式如下: sed options script file 选项 -e script        在处理输入时,将script中指定的命令添加到已有的命令中 -f fi ...

  7. CF 1045 H. Self-exploration 解题报告

    CF 1045 H. Self-exploration 考虑到串的结构一定是 1...0....1....0.....1... 这样的,而\(01\)与\(10\)在转折点交替出现 首先串长一定是\( ...

  8. 芒果学院Python高级开发课程

  9. ThinkPHP5使用jwt进行会话验证

    以往,没有做过前后端分离的项目之前,都是服务器渲染的模板,然后用cookie和session进行账号的权限验证或者是登录状态的管理.后来接触了vue和小程序之后,在进行前后端分离的时候,就会遇到权限验 ...

  10. windows系统查看端口占用

    netstat -ano #列出所用端口使用情况 netstat -aon|findstr "端口号"  #查询指定端口 tasklist|findstr "PID&qu ...