Hi list,
I'm trying to make a kind of clone of jdGallery (smoothgallery) for
jQuery and I've stumbled upon a problem, which I haven't been able to
solve yet - I've been browsing through the group and tried some
different search approaches on Google - but I've come up with nil.
There are 2 kinds of animations involved in the system, one which
fades between images, and one that hides/displays a descriptive text
for the image.
HTML structure looks something like this:
<div id="fader">
<div class="el"> <--- image element
<img ... />
</div>
...
<div class="description"> <---- description element
Descriptive text goes here
</div>
</div>
Javascript:
// Hide description before fading images, unsetting content
$
(descriptionEl).animate({'height':'0px'},settings.speed,'linear',function()
{
$(this).html('');
});
Image fading
$(gallery[current].fadeOut(settings.speed);
$(gallery[next].fadeIn(settings.speed);
...
// If the description element is populated with new content, display
the element
if ($descriptionEl).html() != ''){
$(descriptionEl).animate({'height':'26px'},settings.speed);
}
---
If I use the script above, the image fading part will be executed
while the description element is sliding down.. which isn't what I
want.
If I instead put the Image fading and slide up animation into the
callback of the first animation, something goes completely wrong, as
the first image doesn't fadeOut correctly and will be active until it
is going to be shown again.
So i've tried different kinds of queues, but nothing really seem to
work, what am I missing?
Thanks in advance :)
- Jacob
