From ProtoScript

Contents 1 YUI:ToggleOpenClose Behavior 1.1 Example 1.2 Attributes 1.3 Callbacks 1.4 Demo

YUI:ToggleOpenClose Behavior

Toggles an element or elements for toggling their display from open to closed (actually toggles the display attributes between 'block' and 'none'). This means the element will collapse and expand in place.

Example

$proto('.header', {
  SetStyle: {cursor: 'pointer'},
  Click: {
    onClick: {
      ToggleClass: {
        styleClass: 'closed-title',
        otherStyleClass: 'opened-title'
      },
      ToggleOpenClose: {
        target: '.content'
      },
    }  
  }
});

The code above sets up a pointer cursor for all elements with class name 'header' and sets up a Click behavior. When the header is clicked it will toggle the corresponding element with class name = 'content'. In addition it will toggle the style class for the header to flip between open/closed state.

Attributes

Name	Description	Default	Valid Values	Example
target	Selected element or elements to toggle between open & closed. If no value supplied, uses the last targeted element. If value is supplied, use the element(s) selected by the target instead. See Element Scope	Inherits parent target	String value denoting an interface element.	target: '#avatar'

Callbacks

Name	Description
onToggleOpenClose	The callback corresponding to the ToggleOpenClose behavior. Fired when the behavior completes.

Demo

See ToggleOpenClose