js弹出层

1.div附近显示

<div  id="message"></div>

$().delay().hide();  

2.遮罩层

表单提交后遮住页面,等返回数据后再去掉

      <div id="mask" class="mask">正在上传.......</div>
          <script type="text/javascript">
              //兼容火狐、IE8
              //显示遮罩层
              function showMask(){
                  $("#mask").css("height",$(document).height());
                  $("#mask").css("width",$(document).width());
                  $("#mask").show();
              }
              //隐藏遮罩层
              function hideMask(){     

                  $("#mask").hide();
              }  

          </script>
          <style type="text/css">
              .mask {
                      position: absolute; top: 0px; filter: alpha(opacity=60); background-color: #777;
                      z-index: 1002; left: 0px;
                      opacity:0.5; -moz-opacity:0.5;
                  }
          </style>   

3.自动消失

function alertWindow(content,divWidth, divHeight,dialogTop){
	if (divWidth == '') {
		divWidth = "150"
	}
	if (divHeight == '') {
		divHeight = "auto"
	}
	//距离顶部多少
	if (dialogTop == '') {
		dialogTop = "150"
	}
    var iLeft=($(window).width()-divWidth)/2;
    var iTop=($(window).height()-divHeight)/2+$(document).scrollTop();
    var divhtml=$("<div class='pop_alert'>"+content+"</div>").css(
	    	{
	    		position:'absolute',
	    		/*top:iTop+'px',*/
	    		top:($(document).scrollTop() + dialogTop) + "px",
	    		left:iLeft+'px',
	    	    display:'none',

	    	    width:divWidth+'px',
	    	    height:divHeight
    	    }
    		);
    divhtml.appendTo('body').fadeIn();
    divhtml.appendTo('body').fadeOut(2000);
}

  

js弹出层的更多相关文章

  1. jquery.blockUI.2.31.js 弹出层项目介绍

    {insert_scripts files='user.js'} <style type="text/css"> #float_login{border:1px sol ...

  2. js 弹出层,以及在javascript里定义层样式

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. 简单 JS 弹出层 背景变暗

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

  4. 在Vue中使用layer.js弹出层插件

    layer.js(mobile)是一个小巧方便的弹出层插件,在之前的apicloud项目中被大量使用,但最近对apicloud的IDE.非常不友好的文档和极低的开发效率深感厌烦,决定弃用然后转向Vue ...

  5. JS弹出层制作,以及移动端禁止弹出层下内容滚动,overflow:hidden移动端失效问题

    HTML <div class="layer"> <div class="menu-list"> <span>社会</ ...

  6. Js弹出层,弹出框代码

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

  7. div+js 弹出层

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <t ...

  8. JS 弹出层 定位至屏幕居中

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

  9. JS弹出层遮罩,隐藏背景页面滚动条细节优化

    做过弹层组件的童鞋应该都考虑过特殊情况下取消页面滚动条,让其不能滚动,这样用户体验会好很多,当弹层内容超出屏幕展现范围的时候在弹层上面增加滚动条来查看全部内容. 一.去除滚动条方法给body添加ove ...

随机推荐

  1. 二、启用Docker支持

    一.使用

  2. chrome中 GET /undefined 404

    Chrome中调试网站,会出现 这是由 crxMouse Chrome™ 手势 引起的,关闭即可

  3. b2b

    sku(Stock Keeping Unit)(件)最小库存量单位. spu(一款) 一种详细的规格参数有时候跟spu,规格参数加上颜色+尺寸什么的唯一确定了一个手机,对应的就是sku spu:一款产 ...

  4. 12.k8s的存储卷创建过程

    数据持久化需要数据卷.kubernetes生态提供海量的存储驱动和存储使用方式. [root@master song]# cat pod-demo.yml apiVersion: v1 kind: P ...

  5. BZOJ4514[Sdoi2016]数字配对——最大费用最大流

    题目描述 有 n 种数字,第 i 种数字是 ai.有 bi 个,权值是 ci. 若两个数字 ai.aj 满足,ai 是 aj 的倍数,且 ai/aj 是一个质数, 那么这两个数字可以配对,并获得 ci ...

  6. CH2906 武士风度的牛(算竞进阶习题)

    水..... 直接bfs... #include <bits/stdc++.h> #define INF 0x3f3f3f3f using namespace std; typedef l ...

  7. 对比cp和scp命令 将数据从一台linux服务器复制到另一台linux服务器

    cp命令用来将一个或多个源文件或者目录复制到指定的目的文件或目录.它可以将单个源文件复制成一个指定文件名的具体的文件或一个已经存在的目录下.cp命令还支持同时复制多个文件,当一次复制多个文件时,目标文 ...

  8. 常用LaTeX随时更

    连乘 \prod_{i=1}^n \[\prod_{i=1}^n\] 分数 \frac{a}{b} \[\frac{a}{b}\] 组合数 \tbinom{n}{r}=\tbinom{n}{n-r}= ...

  9. Apache 跟踪用户会话

    打开usertrack_module LoadModule usertrack_module modules/mod_usertrack.so 配置跟踪选项 <IfModule usertrac ...

  10. 洛谷P4891 序列(势能线段树)

    洛谷题目传送门 闲话 考场上一眼看出这是个毒瘤线段树准备杠题,发现实在太难调了,被各路神犇虐哭qwq 考后看到各种优雅的暴力AC......宝宝心里苦qwq 思路分析 题面里面是一堆乱七八糟的限制和性 ...