# Yahoo! UI Library

### slider 3.1.1

Yahoo! UI Library > slider > ClickableRail
Search:
Filters Show Private Show Protected Show Deprecated

## Class ClickableRail

Slider extension that allows clicking on the Slider's rail element, triggering the thumb to align with the location of the click.

### Methods

#### _bindClickableRail

`protected void _bindClickableRail ( )`
Attaches DOM event subscribers to support rail interaction.

#### _defRailMouseDownFn

`protected void _defRailMouseDownFn ( e )`
Default behavior for the railMouseDown event. Centers the thumb at the click location and passes control to the DDM to behave as though the thumb itself were clicked in preparation for a drag operation.

Parameters:
  `e <Event>` the EventFacade for the railMouseDown custom event

#### _getThumbDestination

`protected Array _getThumbDestination ( e , node )`
Calculates the top left position the thumb should be moved to to align the click XY with the center of the specified node.

Parameters:
  `e <DOMEvent>` The mousedown event object
  `node <Node>` The node to position

Returns: `Array`
  the [top, left] pixel position of the destination

#### _initClickableRail

`protected void _initClickableRail ( )`
Initializes the internal state and sets up events.

#### _onRailMouseDown

`protected void _onRailMouseDown ( e )`
Dispatches the railMouseDown event.

Parameters:
  `e <DOMEvent>` the mousedown event object

#### _resolveThumb

`protected Y.DD.Drag _resolveThumb ( e )`
Resolves which thumb to actuate if any. Override this if you want to support multiple thumbs. By default, returns the Drag instance for the thumb stored by the Slider.

Parameters:
  `e <DOMEvent>` the mousedown event object

Returns: `Y.DD.Drag`
  the Drag instance that should be moved

#### _unbindClickableRail

`protected void _unbindClickableRail ( )`
Detaches DOM event subscribers for cleanup/destruction cycle.

### Events

#### clickableRailChange

`clickableRailChange ( event )`
Fires when the value for the configuration attribute 'clickableRail' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.

Parameters:
  `event <Event.Facade>` An Event Facade object with the following attribute specific properties added:
  prevVal
    The value of the attribute, prior to it being set
  newVal
    The value the attribute is to be set to
  attrName
    The name of the attribute being set
  subAttrName
    If setting a property within the attribute's value, the name of the sub-attribute property being set

#### railMouseDown

`railMouseDown ( )`
Broadcasts when the rail has received a mousedown event and triggers the thumb positioning. Use `e.preventDefault()` or `set("clickableRail", false)` to prevent the thumb positioning.
Preventable: This event is preventable by method e.preventDefault(). The default function executed by this event is _defRailMouseDownFn.

### Configuration Attributes

#### clickableRail `- {Boolean}`

Enable or disable clickable rail support.
Default Value: true

Copyright © 2010 Yahoo! Inc. All rights reserved.