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. 使用Guava cache构建本地缓存

    前言 最近在一个项目中需要用到本地缓存,在网上调研后,发现谷歌的Guva提供的cache模块非常的不错.简单易上手的api:灵活强大的功能,再加上谷歌这块金字招牌,让我毫不犹豫的选择了它.仅以此博客记 ...

  2. VS Code & MacOS & Zsh

    VS Code & MacOS & Zsh https://code.visualstudio.com/docs/setup/mac solution OK bug $ cat .zs ...

  3. python数学第六天【指数族】

  4. qtp 自动化测试--点滴 菜单没有了,有些控件运行时找不到

    test项目页签下-没有了 菜单栏:file edit view insert 看不到了 1 解决:在startpage标签下-tool-option-点击 restore layout-确定 2 菜 ...

  5. 安卓Android基础—第一天

    1.1G-4G的介绍 1G 大哥大 2G 小灵通 采用gsm标准(美国军方标准民用化) 发短信 3G 沃 72M/s 4G lte 100M/s 5G 华为 10G/s 小公司卖茶品大公司卖版权(标准 ...

  6. thymeleaf中的判断总结

    判断String字符串,添加引号 th:class="${flag=='forum.html'}?'active'" 判断boolean类型,注意不能当成字符串处理,不能添加引号 ...

  7. Jdk1.6编译,1.7执行,1.7中没有需要的类,为何不会报错

      今天发现一个非常奇怪的问题   import sun.misc.BASE64Decoder; 我在本地引入了jdk1.6中的包,编译也用1.6没问题,但是实际上jdk1.7并没有这个包.在Linu ...

  8. GitHub Desktop 出现“please upgrade your plan to create a new private repository”的解决办法

    转:https://blog.csdn.net/qq_38584262/article/details/82386805 解决办法:去掉最下面的勾

  9. Min_25

    可以用来筛出一个积性函数的前缀和.这个积性函数要满足当\(x\)是质数时,\(f(x)\)可以快速求出,\(f(x^k)\)也可以快速算出. 首先我们要处理出一个\(g(x)=\sum_{x\in p ...

  10. Codeforces Round #453 (Div. 1) D. Weighting a Tree(构造)

    题意 一个 \(n\) 个点 \(m\) 条边的无向连通图中每个点都有一个权值,现在要求给每条边定一个权值,满足每个点的权值等于所有相连的边权之和,权值可负. 题解 如果图是一棵树,那么方案就是唯一的 ...