DHTML:预加载图片轮显

王朝html/css/js·作者佚名  2008-05-18
窄屏简体版  字體: |||超大  

<html><head>

<script language="JavaScript">

//Preloaded slideshow script- By Jason Moon

//For this script and more

//Visit <a href="http://www.dynamicdrive.com" target="_blank">http://www.dynamicdrive.com</a>

// PUT THE URL'S OF YOUR IMAGES INTO THIS ARRAY...

var Slides = new Array('attachments/month_054/poster_50first_dates.jpg','attachments/month_054/poster_snickets.jpg','attachments/month_054/poster_she_s_french.jpg');

// DO NOT EDIT BELOW THIS LINE!

function CacheImage(ImageSource) { // TURNS THE STRING INTO AN IMAGE OBJECT

var ImageObject = new Image();

ImageObject.src = ImageSource;

return ImageObject;

}

function ShowSlide(Direction) {

if (SlideReady) {

NextSlide = CurrentSlide + Direction;

// THIS WILL DISABLE THE BUTTONS (IE-ONLY)

document.SlideShow.Previous.disabled = (NextSlide == 0);

document.SlideShow.Next.disabled = (NextSlide ==

(Slides.length-1));

if ((NextSlide >= 0) && (NextSlide < Slides.length)) {

document.images['Screen'].src = Slides[NextSlide].src;

CurrentSlide = NextSlide++;

Message = 'Picture ' + (CurrentSlide+1) + ' of ' +

Slides.length;

self.defaultStatus = Message;

if (Direction == 1) CacheNextSlide();

}

return true;

}

}

function Download() {

if (Slides[NextSlide].complete) {

SlideReady = true;

self.defaultStatus = Message;

}

else setTimeout("Download()", 100); // CHECKS DOWNLOAD STATUS EVERY 100 MS

return true;

}

function CacheNextSlide() {

if ((NextSlide < Slides.length) && (typeof Slides[NextSlide] ==

'string'))

{ // ONLY CACHES THE IMAGES ONCE

SlideReady = false;

self.defaultStatus = 'Downloading next picture...';

Slides[NextSlide] = CacheImage(Slides[NextSlide]);

Download();

}

return true;

}

function StartSlideShow() {

CurrentSlide = -1;

Slides[0] = CacheImage(Slides[0]);

SlideReady = true;

ShowSlide(1);

}

</script>

<head>

<body onLoad="StartSlideShow()">

<form name="SlideShow">

<table>

<tr>

<td colspan=2><img name="Screen" width=200 height=300></td>

</tr>

<tr>

<td><input type="button" name="Previous"

value=" << "

onClick="ShowSlide(-1)"></td>

<td align="right"><input type="button" name="Next"

value=" >> " onClick="ShowSlide(1)"></td>

</table>

</form>

</body></html>

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
 
 
© 2005- 王朝網路 版權所有 導航