/    Sign up×
Community /Pin to ProfileBookmark

Javscript Slideshow

Hey, I am trying to create a slide show for my pictures and I have hit a rut. So far the first image correctly fades into the second, but when I try to make the new image beneath into the correct div and reset the alpha for the image it just starts flicking quickly back and forth between the pictures…any help would be very much appreciated! ?

[CODE]<script type=”text/javascript”>
if (document.images)
{
var imgCurrent = new Image();
imgCurrent.src = “img/n721638572_1893964_8829.jpg”;

var imgNext = new Image();
imgNext.src = “img/n721638572_1933047_9615.jpg”;
}

var filler;
var iCount = 100;
var Showtime;
var Fader;

function pageload()
{
document.getElementById(‘current’).src = imgCurrent.src;
document.getElementById(‘next’).src = imgNext.src;
Showtime = setInterval(startshow, 5000);
}
function startshow()
{
Fader = setInterval(fadeout, 20);
}

function fade()
{
document.getElementById(‘current’).style.MozOpacity = (iCount/100);
document.getElementById(‘current’).style.opacity = (iCount/100);
document.getElementById(‘current’).style.KhtmlOpacity = (iCount/100);
document.getElementById(‘current’).style.filter.alpha.opacity = iCount;
}
function fadeout()
{
if(iCount > 0)
{
iCount = iCount-1;
fade();
}
else
{
iCount = 100;
filler = imgCurrent;
imgCurrent = imgNext;
imgNext = filler;
document.getElementById(‘current’).src = imgCurrent.src;
fade();
document.getElementById(‘next’).src = imgNext.src;

alert(‘images switched’);
Fader = clearInterval(Fader);
}
}
</script>

<div id=”top” z-index: 2><img id=”current”></div>
<div id=”bottom” z-index: 1><img id=”next”></div>[/CODE]

to post a comment
JavaScript

0Be the first to comment 😎

×

Success!

Help @Captain20bucks 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 6.16,
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: @nearjob,
tipped: article
amount: 1000 SATS,

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

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...