基于javascript实现页面加载loading效果

 更新时间:2020年09月15日 17:08:09   作者:填坑女侠  
这篇文章主要为大家详细介绍了基于javascript实现页面加载loading效果的相关资料,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实为大家分享了javascript实现页面加载loading效果,供大家参考,具体内容如下

效果图:

<html>
<head>
<title>正在载入</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0">
<table border=0 cellpadding=0 cellspacing=0 width="100%" height="100%">
<tr> 
<form name=loading>
<td align=center> 
<p><font color=gray>正在载入首页,请稍候.</font></p>
<p> 
<input type=text name=chart size=46 style="font-family:Arial; 
font-weight:bolder; color:gray;
 background-color:white; padding:0px; border-style:none;">
<br>
<input type=text name=percent size=46 style="font-family:Arial; 
color:gray; text-align:center; 
border-width:medium; border-style:none;">
<script>var bar = 0 
var line = "||" 
var amount ="||" 
count() 
function count(){ 
bar= bar+2 
amount =amount + line 
document.loading.chart.value=amount 
document.loading.percent.value=bar+"%" 
if (bar<99) 
{setTimeout("count()",100);} 
else 
{window.location = "目标页";} 
}
</script>
</p>
</td>
</form>
</tr>
</table>
</body>
</html>

以上就是本文的全部内容,希望对大家学习javascript程序设计有所帮助。

相关文章

  • 前端无感知刷新token以及超时自动退出实现方案

    前端无感知刷新token以及超时自动退出实现方案

    前端需要做到无感刷新token,即刷token时要做到用户无感知,避免频繁登录,下面这篇文章主要给大家介绍了关于前端无感知刷新token以及超时自动退出的实现方案,需要的朋友可以参考下
    2024-01-01
  • 使弱类型的语言JavaScript变强势

    使弱类型的语言JavaScript变强势

    Javascript (ECMA Script)是一种弱类型的语言.这并不意味着它没有数据类型,只是变量或者Javascript对象属性不需要一个特定类型的值分配给它或者它始终使用相同的值.Javascript中的变量同样支持自由类型转换成为适用(或者要求)的内容以便于使用.
    2009-06-06
  • js关闭浏览器时退出账号的处理

    js关闭浏览器时退出账号的处理

    某些网站,尤其是涉及钱的网站,现在基本都有一个机制是两小时后登陆自动失效,要重新登陆确认身份,那么js关闭浏览器时退出账号如何实现,感兴趣的可以了解一下
    2021-12-12
  • Web Uploader文件上传插件使用详解

    Web Uploader文件上传插件使用详解

    WebUploader是由Baidu WebFE(FEX)团队开发的一个简单的以HTML5为主,FLASH为辅的现代文件上传组件。这篇文章主要为大家详细介绍了Web Uploader文件上传插件使用方法,感兴趣的小伙伴们可以参考一下
    2016-05-05
  • 图解JavaScript作用域链底层原理

    图解JavaScript作用域链底层原理

    当代码在一个环境中执行时,会创建变量对象的一个作用域链,作用域链的用途是保证对执行环境有权访问的所有变量和函数的有序访问,下面这篇文章主要给大家介绍了关于JavaScript作用域链底层原理的相关资料,需要的朋友可以参考下
    2021-11-11
  • 详解JavaScript如何控制并发请求数量

    详解JavaScript如何控制并发请求数量

    某些情况下,我们可能需要对需要执行的多个异步任务进行异步数量控制,只允许固定数量的任务执行,本文为大家整理了JS控制并发请求数量的相关代码,希望对大家有所帮助
    2024-01-01
  • js实现base64、url和blob之间相互转换的三种方式

    js实现base64、url和blob之间相互转换的三种方式

    Blob对象表示一个不可变、原始数据的类文件对象,Blob表示的不一定是JavaScript原生格式的数据,下面这篇文章主要给大家介绍了关于js实现base64、url和blob之间相互转换的三种方式,需要的朋友可以参考下
    2023-04-04
  • 微信小程序使用setData修改数组中单个对象的方法分析

    微信小程序使用setData修改数组中单个对象的方法分析

    这篇文章主要介绍了微信小程序使用setData修改数组中单个对象的方法,结合具体实例形式分析了setData进行数组修改的相关操作技巧与注意事项,需要的朋友可以参考下
    2018-12-12
  • 微信小程序自定义导航栏

    微信小程序自定义导航栏

    这篇文章主要为大家详细介绍了微信小程序自定义导航栏,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-12-12
  • JS实现密码框的显示密码和隐藏密码功能示例

    JS实现密码框的显示密码和隐藏密码功能示例

    这篇文章主要介绍了JS实现密码框的显示密码和隐藏密码功能,涉及javascript针对页面form表单元素动态操作的相关技巧,需要的朋友可以参考下
    2016-12-12

最新评论