Learning JavaScript

Chapter 12

1. One approach is to set the style of the element inline using the style attribute. You can also use getComputedStyle or currentStyle, taking care to compensate for browser differences. A third approach is to store the current settings in a global variable and access it, rather than the actual setting.

2. You can set font size and line height at the same time:

3. obj.style.font="14pt/16pt";
   obj.style.color="#f00";

4. If the text is in an element contained within the one whose style you’ve altered, and this inner element has a different style setting, it will override your setting.

5. One way is to resize it out of existence by setting either the width or height to zero. You can also clip the element to the top, bottom, left, or, right. You can also hide it by setting visibility to hidden, or turn off the display. Finally, you can make it move off the page, or move another element in front of it.

6. Try a mouse-click event handler attached to the image of an item, in combination with a “Buy me” hypertext link for keyboard events; this could move the item to a shopping cart using animation or instantaneously. This effect cuts the amount of coding, ensures the effect is accessible, and is still pretty cool.