读书人

登录时加载动态进度条图片展示不出来的

发布时间: 2012-09-13 09:51:53 作者: rapoo

登录时加载动态进度条图片显示不出来的解决方案
需求:登录时,做一个滚动条和提示,说明当前正在登录
做法:刚开始使用JS动态创建一个表格,显示一个GIF图片和提示信息,之后提交登录表单
错误:发现在IE中正常显示,但在Firefox和Chrome中不显示图片
猜测:Firefox在事件方法或者提交表可能不允许去另外创建一个请求,来下载图片。
修改办法:
做隐藏DIV,放入提示信息和图片(这种在IE中有BUG,提交或者页面跳转时会停止动画,只显示图片第一帧图片)预先加载图片可以判断浏览器类型,根据不同的浏览器选用相应的方法



预加载方法:

 new Image().src = "images/jindu2.gif";

更多预加载,请看:
http://www.fantxi.com/blog/archives/preload-images-css-js/

文中动态创建滚动条方法:
 function createJinDuTiaoDiv(){var jinDuTiaoDiv = getId("jinDuTiao");var table = "<table><tr>";var img = "<td><img src='images/jindu2.gif' style='vertical-align:top' /></td>";var text = "<td valign='middle'>正在登录。。。</td>";var tableEnd = "</tr></table>";jinDuTiaoDiv.innerHTML = table + img + text + tableEnd;}


本文系原创,转载请标明出处:http://gaojianqi6-126-com.iteye.com/blog/1415842

读书人网 >Web前端

热点推荐