/** 
* 浮动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. c++后台开发面试常见知识点总结(六)算法手写

    链表倒转  leetcode-206 连续子数组最大和问题(和最大的连续子序列的和)   leetcode-53 输出字符串中最长的回文子串长度?  leetcode-5 一个字符串,求最长无重复子串 ...

  2. 百度语音 python

    python实现语音识别 我们用到是百度语音识别,因为不掏钱哈哈!首先去百度官网去创建你的 APPID AK SK 这个网上很多大家没创建的自己看下 目前本SDK的功能同REST API,需要联网调用 ...

  3. 【记录】Java NIO实现网络模块遇到的BUG

    1.背景 通过JavaNio实现一个简单的网络模块,有点像Netty的线程模型,一个线程(AcceptThread)建立新连接,把新连接绑定到某个SelectorThread,SelectorThre ...

  4. Delphi DBGrid 实现复选框

    1 在数据库对应的表中加入  bit 列验证是否被选中 然后dbgrid第一列的filedname是bit列 在DBgrid的onDrawColumnCell事件中写: procedure DBGri ...

  5. One Switch for Mac 一键切换系统各项功能

        One Switch 是火球工作室推出的最新 Mac效率软件,它在 Menubar 菜单里集成了隐藏桌面(图标).切换 Dark Mode.保持亮屏.开启屏保的一键切换按钮,将以往这些以独立小 ...

  6. Mamen所需要的jar包怎么生成

    Mamen所需要的jar包怎么生成 使用 mamen 难免碰到,不知道的 jar 包,不知道怎么在 pom 文件中写,分享一个网址,可以把你想要的 jar 包生成 pom 配置文件,个人感觉非常好用. ...

  7. C#中Json转换主要使用的几种方法!

    这篇主要介绍2.4.第三种方法使用的比较局限,所以我没有深入学习. 第二种方法 我使用比较多的方式,这个方法是.NET内置的,使用起来比较方便 A.利用serializer获取json的泛型对象 利用 ...

  8. 阿里云epel源

    epel是个好东西,不过国外的速度实在是不能忍受.所以 有了这篇文章.1. 首先卸载以前装的epel以免影响 rpm -e epel-release 2. 下载阿里提供的epel wget -P /e ...

  9. 4.Grafana展示监控数据

    Grafana是什么?我们知道Node_export监控服务器状态,但是没有具体的展示,简单来说,Grafana的主要作用就是对监控的数据进行图形化展示. docker部署 grafana我们这里采用 ...

  10. 时间同步服务器NTP

    NTP服务器        NTP(Network Time Protocol)[网络时间协议],它是用来同步网络中各个计算机的时间的协议,它可以提供高精准度的时间校正(LAN上与标准间差小于1毫秒, ...