Try something like this:
// ------------------------------------------------------------------
// AUTHOR: Ryan J. Salva
// MODIFIED: December 22, 2007
//
// DESCRIPTION:
// creates a single, rotating image on a page
//
// IMPLEMENTATION:
// <div id="Container">
// <img src="1.jpg" /><img src="2.jpg" /><img src="3.gif" />
// </div>
// <script type="text/javascript">
// window.addEvent('domready',function() {
// var f = new Fader('Container');
// f.start();
// });
// </script>
var Fader = new Class({
Implements: Options,
options: {
pause: 5000,
duration: 1000,
loop: true,
onComplete: Class.empty,
onStart: Class.empty
},
initialize: function(container,options) {
this.setOptions(options);
this.container = $(container);
this.imgs = this.container.getElements('img');
this.imgs.setStyles({
'position':'absolute',
'top':0,
'left':0,
'opacity':0
});
this.imgs[0].setStyle('opacity',1);
this.el = new Element('div',{'styles': {
'position':'relative'
}});
this.el.injectInside(this.container);
this.el.adopt(this.imgs);
this.next = 0;
},
start: function() {
this.show();
this.periodical =
this.show.bind(this).periodical(this.options.pause);
},
stop: function() {
$clear(this.periodical);
},
show: function() {
if (!this.options.loop && this.next==this.imgs.length-1)
$clear(this.periodical);
this.next = (this.next==this.imgs.length-1)?0:this.next+1;
var appear = this.imgs[this.next].effect('opacity', {'duration':
this.options.duration});
appear.start(0,1);
var prev = (this.next==0)?this.imgs.length-1:this.next-1;
var disappear = this.imgs[prev].effect('opacity',
{'duration':this.options.duration});
disappear.start(1,0)
}
});
On Sep 9, 5:21 am, hellspawn <[EMAIL PROTECTED]> wrote:
> as i see you are starting three parallel functions, with a different
> delay
> in time, after some loops this will go crazy
> i think you should try to chain it somehow, maybe using the complete
> event on FX
> look for the FX in documentation
>
> so, u make a fadeout, oncomplete of fadeout u call imageswap and
> fadein and oncomplete of fadein u call fadeout again
>
> i must admit i did not test this, but i think u got the idea :)
> especially that you want to do this, not to copy o use a ready made
> script :)
>
> On Sep 9, 1:47 am, Matt Thomson <[EMAIL PROTECTED]> wrote:
>
> > It's really just an image rotator that I want to do. I like the
> > gallery you linked to, but it uses 700 lines of javascript to control
> > it, and I am hoping to fix up the above code so I can get a rotater
> > done in 20 lines or so.
