Images and Dynamic HTML The previous eight lessons
Images and Dynamic HTML The previous eight lessons have been intensive, covering a lot of ground for both programming concepts and JavaScript. Now it s time to apply those fundamentals to the learning of more advanced techniques. I cover two areas here. First, I show you how to implement the ever-popular mouse rollover in which images swap when the user rolls the cursor around the screen. Then I introduce you to concepts surrounding scripted control of Dynamic HTML in the version 4 and later browsers. The Image Object One of the objects contained by the document is the image object. Unfortunately, this object is not available in all script able browsers. The earliest browsers that you can use this technique with are NN3 and IE4. Therefore, everything you learn here about the image object doesn t apply to NN2 (all versions) or IE3 (for Windows). Even so, I show you how to insert rollover code in pages so that it doesn t cause errors in earlier browsers. Because a document can have more than one image, image object references for a document are stored in the object model as an array belonging to the documentobject. You can therefore reference an image by array index or image name. Moreover, the array index can be a string version of the image s name. Thus, all of the following are valid references to an image object: document.images[n] document.images[ imageName ] document.imageName Each of the tag s attributes is accessible to JavaScript as a property of the image object. No mouse- related event handlers are affiliated with the image object (until you get to IE4+ and NN6+). If you want to make an image a clickable item in older browsers, surround it with a link 12 CHAPTER …. In This Chapter How to precache images How to swap images for mouse rollovers What you can do with Dynamic HTML and scripting ….
We recommend cheap and reliable webhost to host and run your web applications: Coldfusion Web Hosting services.