CODEWITHSUNDEEP
javascript
thanks4help
thanks4help

Reputation: 1

javascript not modifying style properties sequentially

I'm trying to implement a photo gallery using fade functions. I've gone through many so lets use this one as an example.

I've been trying to get my code to work in IE 8 where the amount of stacked images with opacity:0 makes the animations laggy (single images fade smoothly). What solves this problem is to do display:none on the image after its faded out. The problem that arises now is that my images disappear instantly and not after the finished animation. Is there a way to fix this?

My modified demo code:

<div class="button" onclick="

    if(boole)
        document.getElementById('fade').style.display = '';

    fadeEffect.init('fade', boole?1:0);

if(!boole)
        document.getElementById('fade').style.display = 'none';

    boole = !boole;

">Fade In</div>

Upvotes: 0

Views: 70

Answers (1)

Marc B
Marc B

Reputation: 360602

I don't know what's providing that fadeEffect function, but most JS effects libraries have callback capabilities - calling a function when the effect completes. If fadeEffect has such a capability, you'd put the display: none stuff into that callback function. When the effect completes, the callback function is invoked, and off you go.

Upvotes: 1

Related Questions