On Nov 12, 4:46 am, treadmill <[EMAIL PROTECTED]> wrote:
> Hi kangax,
>
> Wow, thank you so much for that extremely prompt reply. And thank you
> very much for the advice, it now works perfectly! :)
>
> If anyone is interested in my code, here's the full working classes
> and how to call it. I've decided to only call the loading of the
> images, after the initial page load, so as not to make the user wait
> any longer than is necessary.
>
> Best regards,
> Kevin
>
> Event.observe(window, "load", function() {
> var imr = new ImageRotator(0,'imgTran');
> imr.imgFadeOut();
>
> });
>
> var ImageRotator = Class.create({
> initialize: function(i,d) {
> this.step=0;
> this.fadestep=0;
> this.timer;
> this.fotimer;
> this.fitimer;
> this.l=d;
// try to only extend element once:
this.l = $(d);
> this.im;
> this.imgLoad(i);
> },
> imgFadeOut: function() {
> clearInterval(this.fotimer);
> this.fadestep = $(this.l).getStyle('opacity');
> if (this.fadestep <= 0) { this.imgTrans(); }
> else { this.fadestep -= 0.02;
> $(this.l).setOpacity(this.fadestep);
// and then don't call `$` anymore:
else {
this.fadestep -= 0.02;
this.l.setOpacity(this.fadestep);
}
> this.fotimer = setInterval(this.imgFadeOut.bind(this),50); }
> },
> imgTrans: function() {
> clearInterval(this.timer);
> if (this.step >= this.im.length) this.step=0;
> $(this.l).setOpacity(0.0);
> $(this.l).src=this.im[this.step].src; $
> (this.l).show(); this.step++; this.imgFadeIn();
Same here. Try to get rid of all the redundant `$`.
> },
> imgFadeIn: function() {
> clearInterval(this.fitimer);
> this.fadestep = $(this.l).getStyle('opacity');
> if (this.fadestep >= 1) { this.timer = setInterval
> (this.imgFadeOut.bind(this),5000); }
> else { this.fadestep += 0.02;
> $(this.l).setOpacity(this.fadestep);
> this.fitimer = setTimeout(this.imgFadeIn.bind(this),50); }
> },
> imgLoad:function(l) {
> this.im = new Array();
>
> if (l == 0) {
> this.im[0]=new Image(388,336);
> this.im[0].src="/images/homepage/
> waitress.jpg";
> this.im[1]=new Image(388,336);
> this.im[1].src="/images/homepage/
> wineshop_till.jpg";
> this.im[2]=new Image(388,336);
> this.im[2].src="/images/homepage/
> vintage_wines.jpg";
> this.im[3]=new Image(388,336);
> this.im[3].src="/images/homepage/
> dessert.jpg";
> this.im[4]=new Image(388,336);
> this.im[4].src="/images/homepage/
> home_page_landscape.jpg";
> }
> else if (l == 1) {
> this.im[0]=new Image(388,291);
> this.im[0].src="/images/winebars/
> transitions/transition_10.jpg";
> this.im[1]=new Image(388,291);
> this.im[1].src="/images/winebars/
> transitions/transition_2.jpg";
> this.im[2]=new Image(388,291);
> this.im[2].src="/images/winebars/
> transitions/transition_3.jpg";
> this.im[3]=new Image(388,291);
> this.im[3].src="/images/winebars/
> transitions/transition_4.jpg";
> this.im[4]=new Image(388,291);
> this.im[4].src="/images/winebars/
> transitions/transition_5.jpg";
> this.im[5]=new Image(388,291);
> this.im[5].src="/images/winebars/
> transitions/transition_6.jpg";
> this.im[6]=new Image(388,291);
> this.im[6].src="/images/winebars/
> transitions/transition_7.jpg";
> this.im[7]=new Image(388,291);
> this.im[7].src="/images/winebars/
> transitions/transition_8.jpg";
> this.im[8]=new Image(388,291);
> this.im[8].src="/images/winebars/
> transitions/transition_9.jpg";
> this.im[9]=new Image(388,291);
> this.im[9].src="/images/winebars/
> transitions/transition_1.jpg";
> }
You could actually remove some duplication in `imgLoad`:
...
imgLoad: function() {
var fileNames1 = $w(
'waitress wineshop_till vintage_wines ' +
'dessert home_page_landscape'
);
var fileNames2 = $w(
'transition_10 transition_2 ' +
'transition_3 transition_4 ' +
'transition_5 transition_6 ' +
'transition_7 transition_8 ' +
'transition_9 transition_1'
);
var currentNames,
height,
basePath,
width = 388;
if (l == 0) {
currentNames = fileNames1;
height = 336;
basePath = '/images/homepage/';
}
else if (l == 1) {
currentNames = fileNames2;
height = 291;
basePath = '/images/winebars/transitions/';
};
this.im = currentNames.inject([], function(all, name) {
var image = new Image(width, height);
image.src = basePath + name + '.jpg';
all.push(image);
return all;
});
}
...
> }
>
> });
--
kangax
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Prototype & script.aculo.us" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~----------~----~----~----~------~----~------~--~---
