< script >
</ script >
< html >
< body >
< div id = " testMessage " style = " border:2px solid skyblue;width:300px;height:60px " ></ div >
< div id = " photoContrl " style = " display:none " >
< button onclick = " prevPhoto() " > Previous </ button >
< button onclick = " nextPhoto() " > Next </ button >
< button onclick = " autoPlay() " id = " pp " > Play </ button >
< button onclick = " stopPlay() " > Stop </ button >
</ div >
< div style = " border:1px solid gold;width:600px;background:dodgerblue " >< img src = " http://bbsimg.ali213.net/customavatars/1303244.gif " id = " photo " style = "" ></ div >
</ body >
</ html >
< script >
function tM(Message)
{
$( " testMessage " ).innerHTML = Message
}
function dR(topr)
{
document.write(topr)
}
function $(eleId)
{ return document.getElementById(eleId)}
// 预载图片
var imasrc = new Array( " http://news.mydrivers.com/img/20070813/10254068.jpg "
, " http://news.mydrivers.com/img/20070813/10254629.jpg "
, " http://news.mydrivers.com/img/20070813/10255187.jpg "
, " http://news.mydrivers.com/img/20070813/10255626.jpg "
, " http://news.mydrivers.com/img/20070813/10260076.jpg "
, " http://news.mydrivers.com/img/20070813/10260471.jpg "
, " http://news.mydrivers.com/img/20070813/10261022.jpg "
, " http://news.mydrivers.com/img/20070813/10261479.jpg " ) // 图片路径写入数组
var preIma = new Array()
var dB = new Date()
for (i = 0 ;i < imasrc.length;i ++ ) // 预载所有图片
{
preLoadImg(i)
}
function preLoadImg(imgIndex) // 预载指定图片图片
{
preIma[imgIndex] = new Image()
preIma[imgIndex].imgReadyStatus = false
preIma[imgIndex].imgIndex = imgIndex
preIma[imgIndex].onload = imgLoad
preIma[imgIndex].onerror = imgError
preIma[imgIndex].onabort = imgAbort
preIma[imgIndex].src = imasrc[imgIndex]
}
function imgLoad() // 预载完成
{
this .imgReadyStatus = true
}
function imgError() // 预载失败
{
preLoadImg( this .imgIndex)
}
function imgAbort() // 预载取消
{
preIma.splice( this .imgIndex, 1 )
}
var checkAgain
function checkImgReadyStatus() // 检索加载状态
{
var imgReadyStatus = true
var persent = 0
var dE = new Date()
for (i = 0 ;i < preIma.length;i ++ )
{
if ( ! preIma[i].imgReadyStatus)
{imgReadyStatus = false }
else
{persent ++ }
}
tM( " 完成: " + (persent / preIma.length * 100 ).toFixed( 2 ) + " %<br>载入: " + persent + " 张图片<br>消耗时间: " + ((dE - dB) / 1000 ).toFixed( 0 ) + " 秒 " ) // 显示进度
if (imgReadyStatus)
{
$( " photoContrl " ).style.display = " block "
autoPlay()
clearTimeout(checkAgain)
}
else
{
checkAgain = setTimeout(checkImgReadyStatus, 1000 ) // 检索频率
}
}
checkImgReadyStatus()
预载图片(怕忘了,放这儿)
最新推荐文章于 2024-09-14 09:30:00 发布