JavaScript Bible, Gold Edition part 176. This book will bring programmers and non-technical professionals, including casual programmers and scripters, painlessly up to speed on all aspects of mastering JavaScript. Key topics include programming fundamentals, JavaScript language elements and how to use them effectively, and how to easily and efficiently add powerful new functionality to HTML documents and Java applets. | CD-242 Part VI Appendixes Listing 15-42 continued onMouseUp return setImage Left Up onMouseOut return setImage Left Norm IMG NAME Left SRC HEIGHT 16 WIDTH 16 BORDER O A nbsp nbsp A HREF javascript void O onMouseOver return setImage Right Up onMouseDown return setImage Right Down onMouseUp return setImage Right . Up onMouseOut return setImage Right Norm IMG NAME Right SRC HEIGHT 16 WIDTH 16 BORDER O A CENTER BODY HTML IE4 and NN6 simplify the implementation of this kind of three-state image button by allowing you to assign the event handlers directly to IMG element objects. Wrapping images inside links is a backward compatibility approach that allows older browsers to respond to clicks on images for navigation or other scripting tasks. onMouseEnter onMouseLeave NN2 NN3 NN4 NN6 IE3 J1 IE3 J2 IE4 IE5 Compatibility Example You can modify Listing 15-43 with the syntax by substituting onMouseEnter for onMouseOver and onMouseLeave for onMouseOut. The effect is the same. onMouseMove NN2 NN3 NN4 NN6 IE3 J1 IE3 J2 IE4 IE5 Compatibility Appendix F Examples from Parts III and IV CD-243 Example Listing 15-43 is a simplified example of dragging elements in IE4 . See Chapter 31 for more dragging examples. Three images are individually positioned on the page. Most of the scripting code concerns itself with the geography of click locations the stacking order of the images and the management of the onMouseMove event handler so that it is active only when an item is dragged. Scripts assign the onMouseDown and onMouseUp event handlers to the document object invoking the engage and release functions respectively. When a user mouses down anywhere in the document the engage function starts by invoking setSelectedObj . This function examines the target of the mouseDown event. If it is one of the map images the selectedObj global variable is set to the image object and the element is brought to the front of the stacking
