3 Jquery Banners on one page

Need help making 3 banners on one page

[TheBrandon]

This is what I'm working on:
[revivemediaservices.com ]
I got the Jquery from here:
[mclelun.com ]
Basically I want banner one to cycle 1, 2 then 3. I also want banner two to cycle 4, 5 and 6 and banner three to cycle 7, 8 and 9.

I'd like to delay these. Like banner one will transition from 1 to 2, then 3 seconds later banner two cycles from 4 to 5.

However right now I can't even get 3 of them to function on the same page.

Can someone please point me in the right direction?

[edited by: Fotiman at 8:24 pm (utc) on Jul 27, 2010]
[edit reason] Fixed broken URLs [/edit]

[Fotiman]

The first thing I notice is that your HTML is invalid. You have multiple elements with the same ID. You can't do that. I would start by cleaning up your markup to be valid [validator.w3.org].

Next, the banner code looks like it's designed to work on only a single banner element on a page, and it creates multiple global variables (yuck!). With the way it's currently written, you're not going to be able to have multiples like you'd like. It will require a bit of rewriting.

[TheBrandon]

I've uploaded an updated version.

It's moving the 2nd banner forward 2 places now instead of moving the top one and the bottom one.

[TheBrandon]

OK got it mostly working, now I just need to know how to fix the Next/Previous buttons. Any ideas?

[Fotiman]

It appears to me that you got the next/previous buttons working as well. It also looks like your solution was to duplicate the code for each instance that you needed. That works, but is inefficient. In any case, glad you got it working. If you wanted to make it more efficient, you could reuse much of that code.

[TheBrandon]

That was my next question. Can you help me make it more efficient? My understanding of Java is fairly limited (I know mainly PHP/CSS) but yeah, I did get it to do what I wanted but I'd like to make it more efficient so my co-workers can use this code with ease or I can reuse it with ease. Any suggestions a java newbie could follow?

[Fotiman]

Note, Java and JavaScript are 2 very different technologies. :)

Well, with your bit of code, it would take a bit to rewrite it. But here's how I'd start:

First, I'd create a single global object to act as the namespace. That is, instead of having multiple global variables (jqb_vCurrent, jqb_vTotal, etc.), you would have only a single global variable. Next, I would try to determine what "objects" you had to deal with. In your case, you are creating "Banner" objects. I'd probably define a constructor method for creating Banner objects, and I'd identify what needed to be configurable for each instance.

It's a somewhat vague description, but only because it's a fair amount of work. If you decide to try reducing your script, feel free to post any questions here. :)

[Fotiman]

Just sent you a sticky mail.