Forum Moderators: open

Message Too Old, No Replies

3 Jquery Banners on one page

Need help making 3 banners on one page

         

TheBrandon

7:35 pm on Jul 27, 2010 (gmt 0)

10+ Year Member



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

8:24 pm on Jul 27, 2010 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



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

8:27 pm on Jul 27, 2010 (gmt 0)

10+ Year Member



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

8:34 pm on Jul 27, 2010 (gmt 0)

10+ Year Member



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

Fotiman

8:49 pm on Jul 27, 2010 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



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

8:53 pm on Jul 27, 2010 (gmt 0)

10+ Year Member



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

2:36 pm on Jul 28, 2010 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



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

8:07 pm on Jul 28, 2010 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Just sent you a sticky mail.