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. Java多线程4:Thread中的静态方法

    一.Thread类中的静态方法 Thread类中的静态方法是通过Thread.方法名来调用的,那么问题来了,这个Thread指的是哪个Thread,是所在位置对应的那个Thread嘛?通过下面的例子可 ...

  2. Memcached 分布式集群

    首先解释一下我的标题,用到了 分布式 和 集群两个单词,为什么是集群?解决[相同业务]问题的服务器多个以上就称为集群.这里memcached就是做相同任务的(提供缓存服务)为什么是分布式?虽然针对的是 ...

  3. How to install macOS Sierra on Skylake

    create usb installer sudo /Applications/Install\ macOS\ Sierra.app/contents/resources/createinstallm ...

  4. 训练赛-Eyad and Math

    题意:给你四个数,求出a^b是否小于c^d,是的话输出<,否则输出>; 思路:因为数据很大,所以我们需要降低数据的规模,比如用一个log10()函数,这就能解决了,注意,要用scanf输入 ...

  5. ExaWizards 2019

    AB:div 3 AB??? C:div 1 C???场内自闭的直接去看D.事实上是个傻逼题,注意到物品相对顺序不变,二分边界即可. #include<iostream> #include ...

  6. JMeter——JMeter如何进行汉化

    1.找到bin目录下的jmeter.properties文件 2.打开找到第37行,打开注释并将language=en改为language=zh_CN 3.重启

  7. Redis——windows下如何连接Linux(centos7.x)虚拟机的Redis——【二】

    我的虚拟网络使用的是桥接网络和windows主机IP为同一网段,做下面步骤之前请确保网络通畅. 使用cmd的ping来测试 软件 https://redisdesktop.com/download 下 ...

  8. AtCoder Regular Contest 102 E Stop. Otherwise...

    题目链接:atcoder 大意:有\(n\)个骰子,每个骰子上面有\(k\)个数,分别是\(1\text ~ k\),现在求\(\forall i\in[2...2k]\),求出有多少种骰子点数的组合 ...

  9. bzoj 2653: middle (主席树+二分)

    2653: middle Time Limit: 20 Sec  Memory Limit: 512 MBSubmit: 2522  Solved: 1434[Submit][Status][Disc ...

  10. PHP require php > 5.3.0

    项目版本要求 在5.3版本以上,如果是用 phpStudy 环境,那么直接切换版本即可