页面加载进度条、图片查看主键增大

页面加载进度条、图片查看主键增大

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="PageLoading.aspx.cs" Inherits="PageLoading" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

    <script src="jquery-1.3.1.js" type="text/javascript"></script>

    <script type="text/javascript">
        $(function() {
            $("#open").click(function() {
                if (parseInt($("#fadeDiv").size()) == 0) {
                    var fadeDiv = document.createElement("div");
                    fadeDiv.id = "fadeDiv";
                    fadeDiv.innerHTML = "";
                    document.body.appendChild(fadeDiv);
                }
                $("#fadeDiv").css({ top: 0, left: 0, bottom: 0, right: 0, backgroundColor: "lightgrey", opacity: 0.2, position: "absolute", zIndex: "50" });
                //$("#fadeDiv").css({ height: document.body.scrollHeight });  //有滚动条时用

                $("#max").animate({ width: "400px", height: "420px", left: "50%", marginLeft: "-200px", top: "200px" }, 500);
                $("#img1").animate({ width: "400px", height: "400px", marginLeft: "0", top: "200px" }, 500);
            });
            $("#close").click(function() {
                $("#fadeDiv").css({ top: 0, left: 0, bottom: 0, right: 0, backgroundColor: "white", opacity: 0, position: "absolute", zIndex: "-100" });
                //$("#fadeDiv").css({ height: document.body.scrollHeight });  //有滚动条时用

                $("#max").animate({ width: "0px", height: "0px", left: "50%", marginLeft: "0px", top: "-30px" }, 500);
                $("#img1").animate({ width: "0px", height: "0px", left: "50%", marginLeft: "0px", top: "-30px" }, 500);
            });
        });
    </script>

</head>
<body>
    <form />
        </div>
    </div>

    <script type="text/javascript">
       // $("#loading").fadeOut()
    </script>

    </form>
</body>
</html>

相关文章:

  • 2021-08-29
  • 2022-12-23
  • 2021-05-26
  • 2021-12-06
  • 2021-09-04
  • 2021-08-18
猜你喜欢
  • 2022-12-23
  • 2022-02-07
  • 2021-10-31
  • 2021-10-29
  • 2021-11-17
  • 2021-08-22
  • 2022-12-23
相关资源
相似解决方案