slideshow fade out/fade in

[kpk1l]

hi
I want a slideshow that disappear for 30 seconds and then reappear
can you help me please
thx

[Beverleyh]

Can you explain more please?

What kind of slideshow? Have you seen an example to show us? Do you want the images to hide/show every 30 seconds or the whole slideshow interface (Although why you'd want that seems a bit unlikely but there you go)?

Please provide more information, and any script/slideshows you're working with or have seen already - if a slideshow uses jQuery you could probably use a hide/delay/show function similar to this: http://stackoverflow.com/questions/4...hide-in-jquery

[kpk1l]

i use a slideshow at animationddd.ucoz.net (my website)
i want to hide/show every 20-30 sec the whole slideshow interface
it is possible?

[jscheuer1]

Put this in the head of the page after the external script tag for jQuery:

<script type="text/javascript">
jQuery(window).load(function(){
	var $ = jQuery, secs = 25, $slider = $('.slider'), dir = 'Up';
	function showhideslider(){
		dir === 'Down' && $slider.parent()['slide' + dir]();
		$slider.animate({opacity: dir === 'Up'? 0 : 1}, 'slow', function(){
			dir === 'Up' && $slider.parent()['slide' + dir]();
			dir = dir === 'Up'? 'Down' : 'Up';
			setTimeout(showhideslider, secs * 1000);
		});
	}
	setTimeout(showhideslider, secs * 1000);
});
</script>

[kpk1l]

thanks a lot John

[kpk1l]

one more question... if i have slider1 and slider2 and i want to see slider1 for 25sec then slider2 for 25 sec...again slider1...etc....
can i change something in this code?

[kpk1l]

with class .slider for slider1 and .slider2 for slider2

[jscheuer1]

It would help me to help you if you setup the page with two sliders, both visible at all times (that means without the script code we just worked out), in the spot or spots on the page where you want them to be. This can be a separate temporary page if you like. I probably need to access the second one's parent element by its class or id selector and might (depending upon where they are and the answers to the two below questions) need to do the same with the first one's parent, and/or wrap them both in yet another container, either via jQuery, or more likely by adding some hard coded markup to the page.

To make it clearer for me about this, please put up the requested demo page and answer these two questions:

1. On the current page with one slider, when it appears the layout shifts in a smooth sliding motion and then the show fades in, when it disappears it fades out then shifts the layout in a smooth sliding motion. With the new setup, are both sliders supposed to occupy the same layout space on the page with no shift in the layout, or are they to be in separate positions with the layout shifting in each of those spots to show/hide that slider?
   
   
2. If they are to occupy the same layout space, they could still smoothly slide into and out of that space, which could physically close and open, or could remain a constant size while the shows slide into and out of it, or could be a constand size with fade in/out only, no sliding. Would it be better to:
   
   
   a.) have that space expand and contract as the shows change, or
   
   b.) have a constant size and have them each slide into and out of that space, or
   
   c.) simply fade in and out of, rather than also slide into that space?

[kpk1l]

As you noticed I use the ucoz paltform.
I have 2 modules that I use: one for TV Show(/load) and another for Movies(/publ)
Ucoz don't let me to get, in one slideshow, entries from both modules. So I'm wondering if I can do another slide for second module (in same layout space at the first)
First slide (that i use now) use class .slider
I thought to copy the same class but to call it .slider2 (to be easier to use via jQuery)(I don't have another idea )

To answer to your question -

they are to occupy the same layout space, they could remain a constant size while the shows slide into and out of it, or could be a constand size with fade in/out only

,
I want to try both effects(slide and fade) to see which fits better.

Sorry if I bother you too much.

[jscheuer1]

No bother. The amount of work I have to do is less the more information I have before I start.

So, it's slide in and fade in into a single space in the layout whose height doesn't change. If you can make the other slideshow and have it work on the page, we can do that.

If you would just setup a page like that with the two slideshows on it and everything (or at least most of everything) else just as you want it to be. Do not use the javascript code I gave you. Put the two slideshows one after the other on the page in the spot where you want them to be - so it ends up being twice as high as you want it and they're both seen all of the time. Let me worry about hiding one to begin with and setting up the code for alternating between them. Do that and I should be able to work it out pretty quickly.