MSSlider

The MSSlider format creates a slider control. This control is implemented using a dHTML element behaviour, and only works for Microsoft Internet Explorer. See http://msdn.microsoft.com/workshop/author/behaviors/library/slider/slider.asp for more information. MSSlider requires the ResourcePath attribute to be set correctly in your opening cf_terraform tag or your settings file. You will also need to provide slider graphics in your web page's folder. You can copy the .GIF files from [ResourcePath]/formats/slider/ or create your own.

The following special attributes are available for MSSlider:

• barColor
  Optional. Color of the slider bar.
• dynamic
  Optional. Create a continuous stream of onchange events as the slider moves?
• orientation
  Optional. Horizontal or vertical. Defaults to horizontal.
• snap
  Optional. Boolean. Snap to nearest tick mark?
• tickColor
  Optional. Color of the tick marks.
• tickInterval
  Optional. The numeric interval between each tick mark.
• tickNumber
  Optional. The total number of tick marks. Specify tickInterval or tickNumber but not both.
• tickStyle
  Optional. Positioning of tick marks. bottomRight | topLeft | both | none

Note that the TerraField attributes min and max provide the range over which the slider creates values. Other non-TerraField attributes will be passed through to the underlying span. Of particular value are the following style attributes: height, margin, padding, width, background-color. For example: style="width : 300px; background-color : transparent"

Examples

A plain MSSlider control:

<cf_terrafield
  name="MyMSSliderField1"
  format="MSSlider"
/>

Specify number of ticks or the interval between the ticks — the result is the same:

 

<cf_terrafield
  name="MyMSSliderField2"
  format="MSSlider"
  orientation="vertical"
  ticknumber="6"
  min="0"
  max="100" 
  tickstyle="topLeft"
  style="background-color : ##eeeeee" 
/>
<cf_terrafield
  name="MyMSSliderField3"
  format="MSSlider"
  orientation="vertical"
  tickinterval="20"
  min="0"
  max="100" 
  tickstyle="bottomright"
  style="background-color : ##eeeeee"  
/>