RSS Feed
Download our iPhone app
Browse DevX
Sign up for e-mail newsletters from DevX


Rotate Content Easily with Object-Oriented JavaScript

Although the need to display ever-increasing content is relentless, the screen real-estate available to hold that content increases far less rapidly. One solution is to display rotating lists of items. By rotating the list, you can fit more information into less space, add visual interest to your pages, and still provide a simple and intuitive user experience.

Presenting information on the web can be a challenge, especially when you need to show more information than fits neatly on a given screen. This article presents a way to increase the density of information on the screen by rotating content within a fixed area dynamically. The popularity of rotating content areas indicates that users appreciate the value of having content on the page change dynamically. The trick is to change the content in such a way as not to distract the user. You can do that by limiting the area that changes, thus allowing users to view your content while simultaneously giving you a way to present more of the information that users crave.

Many Web sites possess an abundance of information—but screen real estate is at a premium. One method for presenting a lot of information in a small space is to create an area that rotates content within your page. So, the problem is, how do you create a rotating content area?

Write some simple object-oriented JavaScript, and a few style rules, combine them with a timer and some common-sense UI design guidelines, and you're well on your way!

Close Icon
Thanks for your registration, follow us on our social networks to keep up-to-date