Fancy slide is a great slide show module. Its easy to use and it does what you might expect. There is only one thing. The background of a customers site has a gradient and the overlaying images (objects) need to be transparent. So I made all the hard work of making masks for each object in the images and save the images as png with tranparency.

The first time you enter the page with the fancy slide block, you see all the images of the slide show one above the other. While fading, the images fade out one after another. After all images in the slide show are faded once, its working great. Its just the first look at the site block.

I really like Fancy slide and hope, it could be fixed.

CommentFileSizeAuthor
#4 fs-allimages.patch1.37 KBjackwestbrook

Comments

bamakojeff’s picture

bamakojeff commented

I see the same thing. One way to solve it is to hide all but the first image at creation if we are using fade or no animation. You can do this by editing the file "sites/all/modules/fancy_slide/js/fancy_slide.js" and go to line # 127. It starts a block of code which looks like this:

for (i = 0; i < slides; i++){
     $('li:eq(' + i + ')', obj).css('zIndex', depth);
     depth--;
}

Insert the two extra lines you see in the next block:

for (i = 0; i < slides; i++){
     $('li:eq(' + i + ')', obj).css('zIndex', depth);
     depth--;
     $('li:eq(' + i + ')', obj).stop(true, true).hide();
}
$('li:eq(0)', obj).stop(true, true).show();

This will go through and hide all but the first image. Then the animation will show them as needed or you can click on the controls to show them. But you won't see the images stacked on top of each other if they are different sizes.

I have no idea if this will really mess anything else up. :-) My quick tests on our sites don't show any problems, but "YMMV", as they say.

HTH

jackwestbrook’s picture

jackwestbrook commented

Hi there,
Can you tell me a little more about the setup of both your sites or even provide links? Are you using jQuery 1.2 or 1.3? What other modules are enabled on your site.

bamakojeff - I'll look at your fix and try to work something into the next release. I'm currently rewriting all the fancyslide js. You mentioned using different sized images... this wasn't something I considered in the original writing of the js as we'd always created slideshows with imagecache.

Cheers,
Jack

chiefkong’s picture

chiefkong commented

Hi jackwestbrook,
I am using jQuery 1.2.6 (along with the drupal module 6.x-1.3) and the other modules are:

Content Access, Administration menu, CCK, FileField, ImageField, Internationalization, 'me' Aliases, CKEditor, Nice Menus, Page Title, Shadowbox and of course Views.

Frank

jackwestbrook’s picture

jackwestbrook commented
StatusFileSize
new fs-allimages.patch1.37 KB

Hey guys,
I've taken a look at this and bamakojeff was spot on with where the issue was. To save on processing though I've implemented it slightly differently.

A patch is attached! Let me know if it does / doesn't fix things for you.

Cheers,
Jack

chiefkong’s picture

chiefkong commented

Hi jackwestbrook,

I applied the patch and it seems to work with PNG files, although the first image seems to stay 3 times longer then the other PNGs.

Frank

extensive’s picture

extensive commented

Use Css Trick for this
.block-fancy_slide li {
background-image:url("images/bodyBg.jpg") !important;---------------your bg image of banner area
background-position:0 0px !important;-------------------------according bg
background-repeat:no-repeat;
}

this solve your problem