子网掩码掩码计算器_Javascript加载掩码

最新推荐文章于 2024-07-26 20:46:33 发布

cxygs5788

最新推荐文章于 2024-07-26 20:46:33 发布

阅读量423

点赞数

文章标签：子网掩码 javascript css html dom ViewUI

原文链接：https://bytes.com/topic/javascript/insights/743551-javascript-loading-mask

版权

子网掩码掩码计算器

JavaScript载入遮罩

要求：对JavaScript和HTML知识很少。 启用JavaScript的浏览器。 应用程序：对于所有加载缓慢且分段加载的页面很有用，因此不必看分页加载。

将其放在您的<head>中：

<script type="text/javascript">
function overlay() {
elem = document.getElementById("overlay");
 elem.style.visibility="hidden";
elem = document.getElementById("bodydiv");
 elem.style.visibility="visible"; 
 }
</script>

使您的<body>标签看起来像这样：

<body onLoad="overlay()">

在您的<body>内部，放在所有内容的顶部：

<div id="overlay" style="width:100%; height:100%; position: absolute; background-color:#000000;">
    <table><tr><td valign="center" height="100%" width="100%">
        <div align="center" style="border: 1px solid black; background-color:#ffffff; width:50%;">
        <h3>Loading... Please Wait.</h3>
        </div>
    </td></tr></table>
</div>
<div id="bodydiv" style="visibility:hidden;">
    ... (your current page body) ...<br />
    ... (Which should be long..) ...<br />
    ... (because it has to load) ...<br />
    ... (so yeah.. this is body) ...
</div>

因此，您将共同获得：

<html>
<head>
<title>Loading Screen</title>
<script type="text/javascript">
function overlay() {
elem = document.getElementById("overlay");
 elem.style.visibility="hidden";
elem = document.getElementById("bodydiv");
 elem.style.visibility="visible"; 
 }
</script>
</head>
<body onLoad="overlay()"> 
<div id="overlay" style="width:100%; height:100%; position: absolute; background-color:#000000;">
    <table><tr><td valign="center" height="100%" width="100%">
        <div align="center" style="border: 1px solid black; background-color:#ffffff; width:50%;">
        <h3>Loading... Please Wait.</h3>
        </div>
    </td></tr></table>
</div>
<div id="bodydiv" style="visibility:hidden;">
    ... (your current page body) ...<br />
    ... (Which should be long..) ...<br />
    ... (because it has to load) ...<br />
    ... (so yeah.. this is body) ...
</div> 
</body>
</html>

并且您有一个愉快的加载消息。您可以编辑内容（div样式等），但是JavaScript必须保持原样，除非您知道自己在做什么。这确实是一个简单的脚本，但是适合那些想要的脚本。

真诚的

埃拉贡

翻译自: https://bytes.com/topic/javascript/insights/743551-javascript-loading-mask

子网掩码掩码计算器

cxygs5788

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
子网掩码掩码计算器_Javascript加载掩码

子网掩码掩码计算器 JavaScript载入遮罩要求：对JavaScript和HTML知识很少。启用JavaScript的浏览器。应用程序：对于所有加载缓慢且分段加载的页面很有用，因此不必看分页加载。将其放在您的<head>中： <scripttype="text/javascript">functionoverlay(){elem=docu...
复制链接

扫一扫