教程集 > jQuery > jquery 教程 > 正文 ajax loading 效果代码

ajax loading 效果代码

发布时间：2023-12-24 编辑：jiaochengji.com

教程集为您提供ajax loading 效果代码等资源，欢迎您收藏本站，我们将为您提供最新的ajax loading 效果代码资源

提示：您可以先修改部分代码再运行

<html>  <head>  <title>:: ajax loading 效果代码::</title>  <script language="JavaScript">  window.defaultStatus="LoadingBar";  </script>  <style type="text/css">BODY {scrollbar-face-color: #0069B3; scrollbar-shadow-color: #000000;scrollbar-highlight-color: #FFFFFF;scrollbar-3dlight-color: #000000; scrollbar-darkshadow-color: #000000; scrollbar-track-color: #0069B3; scrollbar-arrow-color: #FFCC00;}</style>  <style type="text/css">  #divLoadCont {position:absolute; z-index:500; left:0px; top:0px; width:100%; height:98%; clip:rect(0px 100% 100% 0px); background-color:#0069B3; layer-background-color:#ffffff;}  #divLoad1    {position:absolute; layer-background-color:silver; background-color:#EEEEEE;}  #divLoad2    {position:absolute; left:0px; top:0px; layer-background-color:navy; background-color:#DCDCDC;}  #divLoadText {position:absolute; background-color:transparent; font-family:courier new,verdana,arial,helvetica,sans-serif; font-weight:bold; color:#0069B3; font-size:18px;}   </style>  <script language="JavaScript" type="text/javascript">  /**********************************************************************************     LoadingBar   *   Copyright (C) 2001 Thomas Brattli  *   This script was released at DHTMLCentral.com  *   Visit for more great scripts!  *   This may be used and changed freely as long as this msg is intact!  *   We will also appreciate any links you could give us.  *  *   Made by Thomas Brattli   *********************************************************************************/    function lib_bwcheck(){ //Browsercheck (needed)  	this.ver=navigator.appVersion  	this.agent=navigator.userAgent  	this.dom=document.getElementById?1:0  	this.opera5=this.agent.indexOf("Opera 5")>-1  	this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom && !this.opera5)?1:0;   	this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom && !this.opera5)?1:0;  	this.ie4=(document.all && !this.dom && !this.opera5)?1:0;  	this.ie=this.ie4||this.ie5||this.ie6  	this.mac=this.agent.indexOf("Mac")>-1  	this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0;   	this.ns4=(document.layers && !this.dom)?1:0;  	this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.opera5)  	return this  }  var bw=new lib_bwcheck()    numImages = 20  loaderWidth = 250    var px = bw.ns4||window.opera?"":"px";    currentImg = 0  function lib_doc_size(){     this.x=0;this.x2=bw.ie && document.body.offsetWidth-20||innerWidth||0;    this.y=0;this.y2=bw.ie && document.body.offsetHeight-5||innerHeight||0;    if(!this.x2||!this.y2) return message('Document has no width or height')     this.x50=this.x2/2;this.y50=this.y2/2;    return this;  }    //Lib objects  ********************  function lib_obj(obj,nest){     nest=(!nest) ? "":'document.' nest '.'    this.evnt=bw.dom? document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?eval(nest "document.layers."  obj):0;	    this.css=bw.dom||bw.ie4?this.evnt.style:this.evnt;     this.ref=this.css    this.w=this.evnt.offsetWidth||this.css.clip.width||      this.ref.width||this.css.pixelWidth||0;     return this  }  //Moving object to **************  lib_obj.prototype.moveIt = function(x,y){    this.x=x; this.y=y; this.css.left=x px; this.css.top=y px;  }  //Clipping object to ******  lib_obj.prototype.clipTo = function(t,r,b,l,setwidth){     this.ct=t; this.cr=r; this.cb=b; this.cl=l    if(bw.ns4){      this.css.clip.top=t;this.css.clip.right=r      this.css.clip.bottom=b;this.css.clip.left=l    }else{      if(t<0)t=0;if(r<0)r=0;if(b<0)b=0;if(b<0)b=0      this.css.clip="rect(" t "px " r "px " b "px " l "px)";      if (setwidth){  		this.css.pixelWidth = r;  		this.css.pixelHeight = b;  		this.css.width = r px;   		this.css.height = b px;  	}    }  }  var oLoad2  function startLoading(){    page = new lib_doc_size()    oLoadCont = new lib_obj('divLoadCont')    oLoad = new lib_obj('divLoad1','divLoadCont')    oLoad2 = new lib_obj('divLoad2','divLoadCont.document.divLoad1')    oLoadText = new lib_obj('divLoadText','divLoadCont.document.divLoad1')    oLoad.moveIt(page.x50-loaderWidth/2,page.y50-20)    oLoadText.moveIt(loaderWidth/2 - oLoadText.w/2,10)    oLoad.clipTo(0,loaderWidth,40,0,1)    oLoad2.per = loaderWidth/numImages  }  function loadIt(ok){    currentImg       if (oLoad2) oLoad2.clipTo(0,oLoad2.per*currentImg,40,0,1)    if (!ok){      oLoadCont.css.visibility = "hidden"      oLoadCont = null;  	oLoad1 = null;  	oLoad2 = null;    }  }    //DISPLAY FUNCTION - DELETE START -------- DELETE THIS *************  //LEAVE THIS FUNCTION WHILE TESTING. DELETE WHEN READY  function loadIt_display(ok){    currentImg       if (oLoad2) oLoad2.clipTo(0,oLoad2.per*currentImg,40,0,1)    if (currentImg<=numImages) setTimeout("loadIt_display(1)",200)    else{      oLoadCont.css.visibility = "hidden"    }  }  //DISPLAY FUNCTION - DELETE END *************************************  </script>  </head>  <body bgcolor="#0069B3">  <div id="divLoadCont">    <div id="divLoad1">      <div id="divLoad2"></div><br>      <div id="divLoadText">Loading...</div>    </div>  </div>  <script>  startLoading()  loadIt_display(1) //LEAVE THIS LINE WHILE TESTING. DELETE WHEN READY  </script>  <br><br><br>  <center><font face="verdana" size="2" color="#FFFFFF">Chargement de la page termin?..</font><br>  <hr color="#6F8DD9" width="218">  <img src="http://p1.jquerycn.cn/111cn/1/5/1474575151_8444.gif" border="0">  </center>  </body>  </html>

提示：您可以先修改部分代码再运行

您可能感兴趣的文章：
基于jquery的loading效果实现代码
 模拟Vista窗口效果
 jQuery浮动窗口插件 jqFloatBox
js弹出层，效果代码
 弹出层并loading效果
 让jQuery Mobile不显示讨厌loading界面的方法
 使用jQuery全局事件ajaxStart为特定请求实现提示效果的代码
 jQuery Ajax请求状态管理器打包
 jQuery插件 LoadMask
jquery $.ajax相关用法分享

上一篇：网易126上的登陆按钮下一篇：js可拖动的层div

[关闭]

ajax loading 效果代码

最近更新

浏览排行