/** 
* 浮动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. easyui记录

    var rows = top.$("#queryDetailGrid").datagird("getRows"); //获取datagird所有行 top.$( ...

  2. FPN在faster_rcnn中实现细节代码说明

    代码参考自:https://github.com/DetectionTeamUCAS/FPN_Tensorflow 主要分析fpn多层金字塔结构的输出如何进行预测. FPN金字塔结构插入在faster ...

  3. CodeForces 隐藏标签

    设置css 记录. 以防忘记.

  4. StackOverflowError

    "Caused by: java.lang.StackOverflowError: null",当后台出现这个报错信息的时候,证明在代码模块里面出现了死循环,但是不一定是代码的问题 ...

  5. 使用springBoot完成阿里云短信验证

    <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot ...

  6. linux find grep

    find是文件查找, grep是文件内容查找. 1. find find path expression -options[-print -exec -ok] -print 将结果输出到标准输出: - ...

  7. UVALive 3902 Network (树+dfs)

    Consider a tree network with n nodes where the internal nodes correspond to servers and the terminal ...

  8. 76 学习C++

    0 引言 C++语言特性记录,提高对这门语言的理解,进而带动对编程语言特性的理解. 相关网站及教程 # W3Cschool C++教程 https://www.w3cschool.cn/cpp/ # ...

  9. 极简Vue的异步组件函数

    export default new Router({ routes: [ { path: '/live', name: 'live', component: () => import('@/v ...

  10. 【Spring Boot】Spring Boot项目设置多个配置文件,并在生产环境中的Tomcat设置对应的配置文件

    1.修改Spring Boot项目配置文件 除了主配置文件,另外创建2个配置文件,注意命名要用application-*.properties 主配置文件中写入,使用dev作为开发配置 spring. ...