zoukankan      html  css  js  c++  java
  • 将div显示到屏幕中央

    <%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>提示信息</title>
    <script type="text/javascript">
    window.onload = function() {
    var div = document.getElementById("showDiv");
    div.style.position= "absolute";
    div.style.top = (document.documentElement.scrollTop + (document.documentElement.clientHeight -div.offsetHeight) / 2)
    + "px";
    div.style.left = (document.documentElement.scrollLeft + (document.documentElement.clientWidth - div.offsetWidth) / 2)+ "px";
    };
    </script>
    </head>

    <body></body>

    </html>

      2、下面也可以实现,不过要去掉上面的"  <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  "这行代码。

    <script type="text/javascript">
      window.onload = function() {
        var div = document.getElementById("showDiv");
        div.style.position= "absolute";
       div.style.top = (document.body.scrollTop + (document.body.clientHeight -div.offsetHeight) / 2)
    + "px";
    div.style.left = (document.body.scrollLeft + (document.body.clientWidth - div.offsetWidth) / 2)+ "px";
    };
    </script>

      3、如果需要解决兼容性问题,可以使用jquery,如下:

    window.onload = function() {
    var div = document.getElementById("showDiv");
    div.style.position= "absolute";
    div.style.top = (($(document).height()-div.offsetHeight) / 2)+ "px";
    div.style.left = (($(document).width() - div.offsetWidth) / 2)+ "px";
    };

  • 相关阅读:
    多个DataTable的合并成一个新表
    into #临时表的用法
    触发器获取更新前的数据
    C# 多个CSV文件合并成一个文件
    group by 字段名 with ROLLUP
    删除DataTable重复列,只针对删除其中的一列重复的行(转)
    动态注册jS
    JS 验证
    导出Excel
    C# 导入多个工作薄文件
  • 原文地址:https://www.cnblogs.com/lbangel/p/3039794.html
Copyright © 2011-2022 走看看