wood burning stoves*
The moose likes HTML, CSS and JavaScript and the fly likes Rotating banner Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "Rotating banner" Watch "Rotating banner" New topic
Author

Rotating banner

santoshkumar savadatti
Ranch Hand

Joined: Apr 27, 2010
Posts: 95
Hi
Iam creating a simple website.
At the top of the page, i want to place a dynamic banner.
I'm trying to do it with JQuery.
The banner image needs to keep changing.
e.g: when page url is typed, image1 is displayed.Then, after a few milliseconds, image 2 is displayed and so on.
The Problem is, i don't know how to make it happen.Because, there is no click event associated with it.It has to start changing automatically on page load.

I created the following code and placed it at the top of the page, even before the header.But it's not working.



Also, i'm trying to create infinite loop.Hence, the $(this).rotateBanner(); call at the end.
santoshkumar savadatti
Ranch Hand

Joined: Apr 27, 2010
Posts: 95
The issue solved itself.
I found cycle plugin for JQuery.
http://jquery.malsup.com/cycle/
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 60781
    
  65

Or, you could have used window.setInterval().


[Asking smart questions] [Bear's FrontMan] [About Bear] [Books by Bear]
santoshkumar savadatti
Ranch Hand

Joined: Apr 27, 2010
Posts: 95
Thanks Bear.
I want to look at many options before finalizing
window.setInterval() is a good option. But, can I create an infinite loop with it?
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 60781
    
  65

Why would you want to create an infinite loop?
santoshkumar savadatti
Ranch Hand

Joined: Apr 27, 2010
Posts: 95
Because, its a banner.
The Banner is made up of 7 images.
Every few milliseconds, the banner has to change.
And it has to keep changing as long as the page is displayed.
So far, the jQuery Cycle Plugin looks good.But one big problem....I can't control the delay between images.
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 60781
    
  65

You do not want an infinite loop. That's what your initial code does and all that's going to do is to tie the JavaScript engine into knots.

Read what setInterval() does -- it sounds like it's exactly what you need.
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 60781
    
  65

santoshkumar savadatti wrote:Every few milliseconds, the banner has to change.

milliseconds? You need to give people the time to read the banner, no?
santoshkumar savadatti
Ranch Hand

Joined: Apr 27, 2010
Posts: 95
Well, those images constitute one message.
For e.g, consider this line: "No Matter Who You Ar or What You Do.Please Don't Try this at Home!"
In My Banner the message is displayed as different images:

image 1: "No Matter Who You Are"
image 2:"No Matter What you do"
image 3 onwards, Large Bold Font
image3:Please
image4on't
image5:Try This
image6: At Home
image7(small font):Please Don't try This at Home.

this was an example.
when I'm done, I'll post link to my website.

 
With a little knowledge, a cast iron skillet is non-stick and lasts a lifetime.
 
subject: Rotating banner
 
Similar Threads
Undefined Array Problem
Print Screen Web Page
Revisiting DIV
servlets to frames
Print Screen Web Page