JS仿Windows开机启动Loading进度条的方法

本文实例讲述了JS仿Windows开机启动Loading进度条的方法。分享给大家供大家参考。具体实现方法如下：

代码如下:

<html>
<title>JS仿Windows开机启动的Loading进度条</title>
</head>
<body style="margin:0;background-color:#5279CE;" scroll=no>
<table id=lw style="display:block;position:absolute;top:0;left:0;z-index:1;height:;width:" border="0" width="100%" cellspacing="0" cellpadding="0" height="100%">
<tr>
<td width="100%" bgcolor="#5279CE" align="center"><font face="Wingdings" style="font-size:240px;color=#000000">Y</td>
</tr>
<tr>
<td height="10"  bgcolor="#3F5FB2">
<SCRIPT language=jscript>
 elt="0123456789ABCDEF";
 var sTBHTMLS="";
 var sTBHTMLE="";
 for(var i=0;i<0xFF-0x99;i+=1)
 {
  var cr="";
  var l;
  var sTBHTML="";
  l=i+0x99;
  for(var j=0;j<2;j++)
  {
   var n=l % 16;
   l=l >> 4;
   cr=elt.charAt(n)+cr;
  }
  l=i+0x33;
  for(var j=0;j<2;j++)
  {
   var n=l % 16;
   l=l >> 4;
   cr=elt.charAt(n)+cr;
  }
  l=i;
  for(var j=0;j<2;j++)
  {
   var n=l % 16;
   l=l >> 4;
   cr=elt.charAt(n)+cr;
  }
  var w=i>(0xFF-0xA0)?8:4
  sTBHTML="<span style='height:10;width:"+w+";background-color:#"+cr+";margin:0;padding:0'></span>"
  sTBHTMLS+=sTBHTML;
  sTBHTMLE=sTBHTML+sTBHTMLE;
 }
 var sTBHTML=sTBHTMLS+sTBHTMLE;
 document.write("<marquee id='loading' scrollamount='30' direction='right' scrolldelay='1' height='4' style='width:100%;height:10; font-size:6px;background-color:#003399'>")
 document.write(sTBHTML)
 document.write("</marquee>")
</SCRIPT></td>
 </tr>
 <tr>
<td width="100%" height="20%" bgcolor="#ECF0FF"><center><span id=load_txt style="font-size:12px;"><b id=showtxt style="color:red;font-size:12px;line-height:138%;">载入中，请稍候……</b></span></center>
<p align="center" style="font-size:9pt;">CopyRight@</p></td>
 </tr>
</table>
<SCRIPT LANGUAGE="JavaScript">
<!--
var finderror = false;
function gopage()
{
 if(document.readyState=="complete")
 {
 showtxt.innerHTML="载入中，请稍候……"
 loading.style.display="none";
 }
}
//-->
</SCRIPT>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

赞 (0)

相关推荐

  • JS 非图片动态loading效果实现代码

    代码如下: 首先实现该功能的js对象LoadingMsg: 复制代码 代码如下: var Class = { create: function() { return function() { this.init.apply(this,arguments); } } } var LoadingMsg = Class.create(); LoadingMsg.prototype = { init: function(spanId, spanMsg) { this.intervalID = -1000

  • 原生JS实现LOADING效果

    纯文本loading效果,可以自己定义颜色和速度 复制代码 代码如下: /** Loading animation  *  Created by 黑と白の印記 on 15/03/11.  */   function loading(element,lightColor,darkColor,speed,callback){     if(!element&&(!element.innerText||!element.textContent))return     element = type

  • JS Loading功能的简单实现

    JS Loading功能的简单实现

    我们经常在浏览网页的时候会看到数据在加载时,出现的LOADING提示.其实这个功能原理是很简单的,就是一个DIV遮盖当前页面,然后Loading就在遮盖DIV层上展示出来,现在我们来动手实现一下. 1.当前页面: 复制代码 代码如下: <div class="current"><a href="#" onclick="showLoading()">Loading</a></div> 2.遮罩层: 复

  • Ajax风格的一款网页Loading效果

    现在比较流行的一款Ajax风格的网页Loading,多见于一些大量使用Ajax技术的网站中,页面加载时会自动显示提示信息,带载入动画效果,网页加载完自动消失,是一款正在具有Loading功能的网页进度条. Loading body{background-color:#000;} #content{display:none;} #loadbox{position:absolute;top:50%;left:50%;margin-left:-68px;margin-top:-36px;width:2

  • js loading加载效果实现代码

    复制代码 代码如下: protected void Page_Load(object sender, EventArgs e) { ShowLoading(); System.Threading.Thread.Sleep(10000); ClientScript.RegisterClientScriptBlock(typeof(string), "", "<script>document.body.onload=function(){removeLoadMsg()

  • JS基于Ajax实现的网页Loading效果代码

    JS基于Ajax实现的网页Loading效果代码

    本文实例讲述了JS基于Ajax实现的网页Loading效果代码.分享给大家供大家参考,具体如下: 这是一款很不错的网页Loading效果,常用于Ajax交互式网页设计中,点击按钮即可弹出Loading框,若Loading框未加载完成时关闭网页,会弹出确认提示框,用于一些对安全性能要求高的网页交互处理中,比如付款操作. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-ajax-web-loading-style-codes/ 具体代码如下:

  • Ajax loading gif generator

    http://ajaxload.info/ 生成loader动画一个网站

  • JS中图片缓冲loading技术的实例代码

    复制代码 代码如下: var Imgvalue; var Count =13;   //图片数量 var Imgs = new Array(Count); var ImgLoaded =0; //预加载图片 function preLoadImgs() { alert('图片加载中请稍等......'); for(var i=0;i<Imgs.length;i++){ Imgs[i]=new Image(); downloadImage(i); } } //加载单个图片 function dow

  • JS仿Windows开机启动Loading进度条的方法

    本文实例讲述了JS仿Windows开机启动Loading进度条的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <title>JS仿Windows开机启动的Loading进度条</title> </head> <body style="margin:0;background-color:#5279CE;" scroll=no> <table id=lw style="disp

  • jQuery简单实现提交数据出现loading进度条的方法

    本文实例讲述了jQuery简单实现提交数据出现loading进度条的方法.分享给大家供大家参考,具体如下: html部分代码如下,复制然后引入类库即可使用 <html> <head> <style type="text/css"> #bg{ display: none; position: absolute; top: 0%; left: 0%; width: 100%; height: 100%; background-color: black;

  • Android自定义View仿华为圆形加载进度条

    Android自定义View仿华为圆形加载进度条

    View仿华为圆形加载进度条效果图 实现思路 可以看出该View可分为三个部分来实现 最外围的圆,该部分需要区分进度圆和底部的刻度圆,进度部分的刻度需要和底色刻度区分开来 中间显示的文字进度,需要让文字在View中居中显示 旋转的小圆点,小圆点需要模拟小球下落运动时的加速度效果,开始下落的时候慢,到最底部时最快,上来时速度再逐渐减慢 具体实现 先具体细分讲解,博客最后面给出全部源码 (1)首先为View创建自定义的xml属性 在工程的values目录下新建attrs.xml文件 <resourc

  • vue实现简单loading进度条

    刚学习vue不久,今天试着用vue做了一个简单的loading进度条,对于vue的生命周期和钩子函数又有了新的理解,下面分享给大家,绝对入门级. 一.进度条原理 这个就很简单了,也是我们经常可以用到的,这里只做一个最简单的,页面刷新自动加载进度条.主要是让进度条的width不断增加至100%就可以啦~好了,进入正题. 二.jquery实现 <!DOCTYPE html> <html lang="en"> <head> <meta charset

  • Android仿水波纹流量球进度条控制器

    Android仿水波纹流量球进度条控制器

    仿水波纹流球进度条控制器,Android实现高端大气的主流特效,供大家参考,具体内容如下 效果图: CircleView 这里主要是实现中心圆以及水波特效 package com.lgl.circleview; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.gra

  • js实现进度条的方法

    js实现进度条的方法

    本文实例讲述了js实现进度条的方法.分享给大家供大家参考.具体实现方法如下: 1.setTimeout和clearTimeout <html> <head> <title>进度条</title> <style type="text/css"> .container{ width:450px; border:1px solid #6C9C2C; height:25px; } #bar{ background:#95CA0D; f

  • 在vue项目中使用Nprogress.js进度条的方法

    NProgress.js提供页面加载进度条效果,当页面打开加载时,在页面顶部会出现进度条加载动画.NProgress.js是轻量级的进度条组件,使用简便,可以很方便集成到单页面应用中. Ajaxyy应用程序的细长进度条.灵感来自Google,YouTube和Medium. 在vue中使用nprogress.js 安装 $ bower install --save nprogress $ npm install --save nprogress 在项目中引入 在main.js中引入要使用的npro

  • js仿360开机效果

    js仿360开机效果

    本文实例为大家分享了js仿360开机效果的具体代码,供大家参考,具体内容如下 实现效果: 1.点击关闭图片按钮先往下退出再往右退出 实现步骤: 1.封装运动函数 2.给图片上的关闭设置一个盒子 3.给关闭盒子注册点击事件点击后 4.下面图片高度为0,设置一个缓动动画 5.上面图片宽度为0,设置一个缓动动画 缓动动画代码(带回调函数):` function getStyle(obj,attr){ //兼容性写法获得样式 if(window.getComputedStyle){ return win

  • PHP利用APC模块实现文件上传进度条的方法

    本文实例讲述了PHP利用APC模块实现文件上传进度条的方法.分享给大家供大家参考.具体分析如下: 以前的php5.2之前的版本是不能可使用APC模块的,因为之前的压根就没有这个APC模块,如果想使用APC模块实现上传进度条我们必须是php5.2或更高版本. 从5.2开始APC加入了一个叫APC_UPLOAD_PROGRESS的东东,解决了困扰大家已久的进度条问题.并且它把原来的上传时把临时文件全部缓存到内存改成了当临时文件达到设定值时就自动保存到硬盘,有效地改善了内存利用状况. 它的作用原理是在

  • python在控制台输出进度条的方法

    本文实例讲述了python在控制台输出进度条的方法.分享给大家供大家参考.具体实现方法如下: 进度条效果如下所示: |#############################---------------------| 59 percent done 代码如下: class ProgressBar(): def __init__(self, width=50): self.pointer = 0 self.width = width def __call__(self,x): # x in p

随机推荐