Crestron Components Lib - Showcase App

ch5-slider: stretch

ch5-slider stretch

Valid Values: 'width', 'height', 'both'. When the stretch property is set, the slider inherits the width and/or height of the container.

The default value is 'both'.

<div style="height:150px; border: 1px dashed;">
    <ch5-slider
        stretch="both" 
        value="20000"> 
    </ch5-slider>
</div>

stretch width, orientation horizontal

<div style="height:150px; border: 1px dashed;">
    <ch5-slider
            stretch="width"
    >
    </ch5-slider>
</div>

stretch height, orientation horizontal

<div style="height:150px; border: 1px dashed;">
    <ch5-slider 
        value="20000"
        stretch="height"> 
    </ch5-slider>
</div>

stretch width, orientation vertical

<div style="border: 1px dashed">
    <ch5-slider
            orientation="vertical"
            value="20000"
            stretch="width">
    </ch5-slider>
</div>

stretch height, orientation vertical

<div style="height: 350px; border: 1px dashed">
    <ch5-slider
            orientation="vertical"
            value="20000"
            stretch="height">
    </ch5-slider>
</div>

orientation vertical

<div style="height:350px; border: 1px dashed;">
    <ch5-slider
        stretch="both" 
        orientation="vertical" 
        value="20000"> 
    </ch5-slider>
</div>