PDA

View Full Version : Is this the right way to do content rotation?



onlinesaratoga
7 Jul 2007, 12:24 PM
I have a site that rotates content within DIVs. One DIV is for text, the other is for images. Everything is working fine, but I guess I would like to know whether this is the best way to accomplish it, or whether there is a better more "Ext-friendly" way.

TEXT ROTATION


var i=0;
var promoEvents = new Array();
promoEvents[0] = 'text 1';
promoEvents[1] = 'text 2';
promoEvents[2] = 'text 3';
function nextPromoEvent() {
i = i === promoEvents.length-1 ? 0 : i+1;
document.getElementById('eventPromos').innerHTML = promoEvents[i];
Ext.get('eventPromos').center(Ext.get('eventPromosBox'));
Ext.get('eventPromos').move("up",5); // eventPromosBox has a 5px bottom border
Ext.get('eventPromos').fadeIn({duration:2});
myDelay = setTimeout('clearPromoEvent()', 7000);
}
function clearPromoEvent() {
Ext.get('eventPromos').fadeOut({duration:2,callback:nextPromoEvent});
}


IMAGE ROTATION


var j=1; // first image (0) is already in at the beginning
var homeImages = new Array();
homeImages[0] = 'images/image1.jpg';
homeImages[1] = 'images/image2.jpg';
homeImages[2] = 'images/image3.jpg';
homeImages[3] = 'images/image4.jpg';
homeImages[4] = 'images/image5.jpg';
function nextImage() {
Ext.get('home-image-rotation').fadeOut({duration:2,remove: false,callback:nextImage2});
}
function nextImage2() {
j = j === homeImages.length-1 ? 0 : j+1;
document.getElementById('home-image-rotation').innerHTML = '<img border="0" src="' + homeImages[j] + '">';
Ext.get('home-image-rotation').fadeIn({duration:2, callback:nextImage3});
}
function nextImage3() {
myDelay = setTimeout('nextImage()', 4000);
}


Some specific questions:

1. Is there an Ext version of "innerHTML"?
2. Is there a better way to vertically center content in a DIV?

evant
7 Jul 2007, 3:45 PM
1. Use Ext.get('el').update(content);
2. Good question, I've been looking for a decent solution myself, check these out
http://www.jakpsatweb.cz/css/css-vertical-center-solution.html
http://www.student.oulu.fi/~laurirai/www/css/middle/
http://www.badboy.ro/articles/2005-02-20/vertical_align_with_css/

onlinesaratoga
8 Jul 2007, 7:18 PM
Thanks Evant. I actually think it is just easier to use Ext.

Any thoughts on the rotation routines?