Improving an Image Zooming Application with JavaScript
(Page 1 of 4 )
Among the plethora of JavaScript applications that can be developed to extend the existing functionality of a web site, zooming into and out of bitmapped images is quite possibly one of easiest to build and implement. Thus, if you’re a web developer who’s interested in learning how to incorporate basic zooming capabilities into your own web applications, then don’t waste any more time. Start reading this article now!
Welcome to the second part of the series "Image zooming with JavaScript." As its title clearly implies, this series walks you through the development of a highly modular JavaScript-driven application that implements an extensible behavioral layer aimed at providing existing web sites with the capability of zooming into and out of some of its embedded bitmapped images.
Now that you know what this series is about, it's time to rehash the topics that were covered in the previous tutorial. This will give you a better idea of how that article and this one fit together. All right, having said that, you'll surely recall that during the first installment of the series, I built a couple of JavaScript functions whose primary task was performing a basic zoom in/out effect on a unique targeted image.
You'll also remember that the zooming in/out effect was handled by a pair of simple controls built by way of two web form buttons. This mechanism can undoubtedly be improved, but not at this very moment.
Nonetheless, it's perfectly worthwhile to mention that the zooming controls in question were directly included in the pertinent web document. It used some basic structural markup, which is certainly a questionable and rather clumsy approach since these controls should be created dynamically with DOM scripting. But since my plan consists basically of addressing one issue at a time, this one will be fixed in upcoming tutorials of the series.
For now, in the next few lines I'm going to introduce some important improvements to its original structure to make the source code much shorter and more compact. Sounds really interesting, right?
Well, having established the goal of this second article of the series, let's learn how to turn the source code of this JavaScript zooming application into a tight and clean piece of software. Let's begin this educational journey now!
Next: Listing the complete source code of the initial JavaScript zooming application >>
More JavaScript Articles
More By Alejandro Gervasio
/ 3 
