Easy image slider with scriptaculous and lightbox
August 11th, 2008
One lame image slider I made while ago. It just slides images with slight transition effect and shows lightboxed hi-res ones when clicked. See demo here, get example source overe here. Have fun!
JavaScript:
{
l1 = new Slider(‘gal-left’,‘left-gal-left’,‘left-gal-right’);
r1 = new Slider(‘gal-right’,‘right-gal-left’,‘right-gal-right’);
});
function Slider(ele,left,right)
{
this.current = 0;
this.items = $(ele).getElementsByTagName(‘li’);
this.count = this.items.length;
for(i=0;i<this.count;i++)
if(i!=0) this.items[i].style.display = ‘none’;
this.slide = function(direction)
{
Effect.Fade(this.items[this.current]);
if(direction == ‘fw’)
if (this.current == (this.count-1)) { this.current = 0; } else { this.current++; }
else
if (this.current == 0) { this.current = (this.count-1); } else { this.current–; }
Effect.Appear(this.items[this.current]);
};
$(right).observe(‘click’,this.slide.bindAsEventListener(this,‘fw’));
$(left).observe(‘click’,this.slide.bindAsEventListener(this,‘prev’));
}
Popularity: 27% [?]
