/    Sign up×
Community /Pin to ProfileBookmark

Image slide show

Copy linkTweet thisAlerts:
Mar 20.2003

I am using the following code for an image slideshow:

<body BGCOLOR=”#000000″ text=”#CCCCCC” link=”#CC9933″ vlink=”#999966″ alink=”#FFCC33″ onload=”doLink”>

<table border=”0″ cellpadding=”0″ cellspacing=”0″ width=”100%”>
<tr>
<td>
<SCRIPT LANGUAGE=”JavaScript”>
<!–
//set image paths
src = [“images/Pic1.jpg”, “images/Pic2.bmp”, “images/Pic3.jpg”]
//set duration for each image
duration = 2;
ads=[]; ct=0;
function switchAd()
{
var n=(ct+1)%src.length;
if (ads[n] && (ads[n].complete || ads
[n].complete==null))
{
document[“Ad_Image”].src = ads[ct=n].src;
}
ads[n=(ct+1)%src.length] = new Image;
ads[n].src = src[n];
setTimeout(“switchAd()”,duration*600);
}
function doLink(){
} onload = function(){
if (document.images)
switchAd();
}
//–>
</SCRIPT>

<IMG NAME=”Ad_Image” SRC=”images/Pic1.jpg” BORDER=0 width=”150″ length=”120″>

Although the images do change at some point, they don’t begin changing when the page just loads.
Is there something that I need to change in the code to have the images flip as soon as the page loads?

Here’s the website:
[url]www.MonarchMedical.com[/url]

Thanks,
Ninel

to post a comment
JavaScript

9 Comments(s) ↴

Copy linkTweet thisAlerts:
@cyberadeMar 20.2003 — Two suggestions:

1) Move your <script> code into the <head> section

2) Preload your images

var img0 = new Image();

img0 = "images/image_zero.jpg";

var img1 = new Image();

img1 = "imagesimage_one.jpg"; etc...

If you do that remember to update 'src' to point to the image variables.
Copy linkTweet thisAlerts:
@NinelauthorMar 20.2003 — I placed code in the <head> tag, but it still takes a long time to initially load the images.

Am I doing this correctly?
Copy linkTweet thisAlerts:
@JonaMar 20.2003 — Your images will always take a while to load. After, however, they are preloaded it doesn't take as long to go through the slideshow.
Copy linkTweet thisAlerts:
@NinelauthorMar 20.2003 — Why will they take a long time to load?

Did I preload them properly?
Copy linkTweet thisAlerts:
@JonaMar 20.2003 — Yeah. But it takes a long time for them to load, then the page loads, but the images are already loaded. That's how preloading works. It just makes it faster, although it takes some time to load in the first place.
Copy linkTweet thisAlerts:
@NinelauthorMar 20.2003 — So, you are saying that I wrote my code properly and that it will always take that long to load the images initially?
Copy linkTweet thisAlerts:
@JonaMar 20.2003 — Of course! The images has a size, and it has to be loaded somewhere along the line. But when preloaded, the slideshow moves faster. So it takes a while to preload them, but after they're preloaded you don't have to reload each image over and over again every time you run the slideshow.
Copy linkTweet thisAlerts:
@NinelauthorMar 20.2003 — Well that sucks!!!
Copy linkTweet thisAlerts:
@VladdyMar 20.2003 — Do not preload images with the page. Allow the page to load, then load your first image, start the slide-show, then continue loading the rest of images in the background:

http://www.vladdy.net/webdesign/slideshow.html
×

Success!

Help @Ninel spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...