Building a Dynamic Banner with CSS Sprites
(Page 1 of 4 )
CSS sprites are a powerful technique that can be used to incorporate rollover buttons, dynamic banners, and similar elements to any web page. Sprites can also improve the overall performance of a given web site, since they minimize the number of HTTP requests made by the browser. If you’re interested in learning how to make this approach work for you, then you should start reading this article right now!
This is the second part of the series "Using CSS Sprites." In three instructive tutorials, this series teaches you how to create CSS sprites in a few easy steps, and shows you how to use them in the context of real world applications.
Now, stepping back to the topics that I covered in the first part of the series, you'll recall that I explained the underlying theory that surrounds the concept of CSS sprites. I also offered an extensive introduction to the subject by developing a hands-on example where a set of rollover buttons were created in a step-by-step format.
Despite the fact that the referenced rollovers were a simple demonstration in how to use this approach in a concrete situation, it's fair to say that CSS sprites house a wealth of powerful capabilities that can be adequately exploited, particularly if you use them in a smart way.
Most of the time, creating and implementing CSS sprites require careful planning and design of the different background images that are going to be included in a web document. This implies that the process can be more time-consuming than others. However, in certain cases the advantages of using this method with highly-overloaded web sites can be considerable because of the number of requests performed by the browser.
Well, having described in general terms the principal benefits of utilizing CSS sprites, it's time to move forward and pay attention to the subject of this second article. Since in the first part you learned how to use CSS sprites for creating a group of rollover buttons, in this tutorial you'll see how the same concept can be applied to developing a dynamic banner.
Provided that this topic has caught your attention, let's learn together with some illustrative code samples. Let's get started.
Next: Building a banner the classic way >>
More Style Sheets Articles
More By Alejandro Gervasio
/ 13 
