# Beginning JavaScript with DOM Scripting and AJAX

## Chapter 5: Presentation and Behaviour

- ### Changing presentation by accessing the style directly

  - exampleStyleChange.html
  - styleChange.js

- ### Changing presentation by dynamically adding and removing classes

  - exampleClassChange.html
  - classChange.css
  - classChange.js

- ### Making it easy to define styles for scripting supported and unsupported versions

  - exampleDynamicStyling.html
  - dynamicStyling.css
  - dynamicStyling.js

- ### Adding a whole new Style Sheet when DOM is supported

  - exampleStylesheetChange.html
  - lowlevel.css
  - highlevel.css
  - styleSheetChange.js

- ### Making maintenance easier by keeping the CSS class names in an own object

  - exampleDynamicStylingCSSObject.html
  - cssClassNames.js
  - dynamicStyling.css
  - dynamicStylingCSSObject.js

- ### Keeping the CSS class names in an own JSON object

  - exampleDynamicStylingJSON.html
  - dynamicStyling.css
  - cssClassNamesJSON.js
  - dynamicStylingJSON.js

- ### CSS Problem with column heights

  - exampleColumnHeightIssue.html
  - columnHeightIssue.css

- ### JavaScript fix for the column heights problem

  - exampleFixedColumnHeightIssue.html
  - columnHeightIssue.css
  - fixColumnHeight.js

- ### Rollover on list items (CSS only)

  This example will not work in MSIE older than version 7!

  - exampleListItemRolloverCSS.html
  - listItemRolloverCSS.css

- ### Cross-Browser rollover on list items with JavaScript

  - exampleListItemRollover.html
  - listItemRollover.css
  - listItemRollover.js

- ### Creating two different rollover states on parent elements

  - exampleListItemDoubleRollover.html
  - listItemDoubleRollover.css
  - listItemDoubleRollover.js

- ### Event Bubbling

  This example will only work in DOM-2 compliant browsers like Firefox!

  - exampleEventBubble.html
  - eventBubble.js

- ### Supressing Event Bubbling

  This example will only work in DOM-2 compliant browsers like Firefox!

  - exampleStopPropagation.html
  - stopPropagation.js

- ### Preventing default actions

  This example will only work in DOM-2 compliant browsers like Firefox!

  - examplePreventDefault.html
  - preventDefault.js

- ### Collapsing and expanding list items

  This example will only work in DOM-2 compliant browsers like Firefox!

  - exampleListItemCollapse.html
  - listItemCollapse.css
  - listItemCollapse.js

- ### Collapsing and expanding list items (cross Browser)

  - exampleXBrowserListItemCollapse.html
  - xBrowserListItemCollapse.css
  - xBrowserListItemCollapse.js

- ### Collapsing and expanding list items (shorter)

  - exampleListItemCollapseShorter.html
  - listItemCollapseShorter.css
  - listItemCollapseShorter.js

- ### Collapsing and expanding list items without initial flashing of content

  - exampleListItemCollapseNoFlash.html
  - listItemCollapseNoFlash.css
  - listItemCollapseNoFlash.js

- ### Checking which keys were hit to filter keyboard entry

  - exampleKeyChecking.html
  - keyChecking.css
  - keyChecking.js

- ### Helper functions

  - DOMhelp.js