60 likes | 63 Views
The Web Wizard’s Guide To DHTML and CSS. Chapter 5 Creating Dynamic Visibility Applications. Chapter Objectives. To use off-window locations to control visibility To create dropdowndrop-down menus with the visibility property To create collapsible menus with the display property
E N D
The Web Wizard’s Guide To DHTML and CSS Chapter 5 Creating Dynamic Visibility Applications
Chapter Objectives • To use off-window locations to control visibility • To create dropdowndrop-down menus with the visibility property • To create collapsible menus with the display property • To control how much of an image is visible
Hiding Content Off-Screen:A Sliding Menu • Create two side-by-side divs • The left div contains links • The right div opens and closes the menu • Absolute position both divs to hide left div off-screen • Add scripting to move right div on screen • Enhance with setCursor() and setBackground()
Drop-Down Menus • Simulate GUI Menus • Absolute position limits placement to top • Use relative position for topmost div • Drop-down menu in an invisible nested div • Enhance with color and cursor changes
Collapsible Menus • Simulate hierachical file trees • Set display to none to hide menu • Set display to block to show menu • Enhance with text node substitution • Enhance with cursor and color changes
Dynamic Clipping • Control visible portion of content • Use the clip property of the style object