slider.md spanish version

pull/8123/head
Gonzalo2310 2017-11-14 18:33:49 +01:00
parent 41063807c9
commit 560dd8c225
1 changed files with 42 additions and 38 deletions

View File

@ -51,13 +51,13 @@
## Slider ## Slider
Drag the slider within a fixed range. Desliza el slider dentro de un rango fijo.
### Basic usage ### Uso básico
The current value is displayed when the slider is being dragged. El valor actual se muestra cuando se inicia el arrastre del slider.
:::demo Customize the initial value of the slider by setting the binding value. :::demo Personalice el valor inicial del slider configurando el valor vinculado.
```html ```html
<template> <template>
@ -104,12 +104,14 @@ The current value is displayed when the slider is being dragged.
``` ```
::: :::
### Discrete values ### Valores discretos
The options can be discrete. Las opciones pueden ser discretas.
:::demo Set step size with the `step` attribute. You can display breakpoints by setting the `show-stops` attribute. :::demo Set step size with the `step` attribute. You can display breakpoints by setting the `show-stops` attribute.
Configure el tamaño del paso con el atributo `step`. Puede visualizar los puntos de ruptura configurando el atributo `show-stops`.
```html ```html
<template> <template>
<div class="block"> <div class="block">
@ -142,11 +144,11 @@ The options can be discrete.
``` ```
::: :::
### Slider with input box ### Slider con input
Set value via a input box. Inserte el valor a traves de un input
:::demo Set the `show-input` attribute to display an input box on the right. :::demo Configure el atributo `show-input` para que muestre un input a la derecha.
```html ```html
<template> <template>
@ -170,11 +172,12 @@ Set value via a input box.
``` ```
::: :::
### Range selection ### Seleccion de rangos
Selecting a range of values is supported. Se soporta la selección de un rango de valores.
:::demo El ajuste del atributo `range` activa el modo range, donde el valor vinculado es un array compuesto por dos valores límite.
:::demo Setting the `range` attribute activates range mode, where the binding value is an array made up of two boundary values.
```html ```html
<template> <template>
<div class="block"> <div class="block">
@ -199,9 +202,10 @@ Selecting a range of values is supported.
``` ```
::: :::
### Vertical mode ### Modo Vertical
:::demo El ajuste del atributo `vertical` a `true` habilita el modo vertical. En el modo vertical, se requiere el atributo `height` .
:::demo Setting the `vertical` attribute to `true` enables vertical mode. In vertical mode, the `height` attribute is required.
```html ```html
<template> <template>
<div class="block"> <div class="block">
@ -225,26 +229,26 @@ Selecting a range of values is supported.
``` ```
::: :::
## Attributes ## Atributos
| Attribute | Description | Type | Accepted Values | Default | | Atributo | Descripción | Tipo | Valores aceptados | Por defecto |
|---------- |-------------- |---------- |-------------------------------- |-------- | | ------------------- | ---------------------------------------- | --------------- | ----------------- | ----------- |
| min | minimum value | number | — | 0 | | min | valor minimo | number | — | 0 |
| max | maximum value | number | — | 100 | | max | valor máximo | number | — | 100 |
| disabled | whether Slider is disabled | boolean | — | false | | disabled | si el Slider esta deshabitado | boolean | — | false |
| step | step size | number | — | 1 | | step | tamaño del paso | number | — | 1 |
| show-input | whether to display an input box, works when `range` is false | boolean | — | false | | show-input | Si se muestra el input, trabaja cuando`range`es false | boolean | — | false |
| show-input-controls | whether to display control buttons when `show-input` is true | boolean | — | true | | show-input-controls | si se muestran los botones de control cuando`show-input`es true | boolean | — | true |
| show-stops | whether to display breakpoints | boolean | — | false | | show-stops | si se muestran los puntos de ruptura (breakpoints) | boolean | — | false |
| show-tooltip | whether to display tooltip value | boolean | — | true | | show-tooltip | si se muestra el valor en un tooltip | boolean | — | true |
| format-tooltip | format to display tooltip value | function(value) | — | — | | format-tooltip | formato para mostrar el valor del tooltip | function(value) | — | — |
| range | whether to select a range | boolean | — | false | | range | si se usaran un rango | boolean | — | false |
| vertical | vertical mode | boolean | — | false | | vertical | modo vertical | boolean | — | false |
| height | Slider height, required in vertical mode | string | — | — | | height | alto del Slider, requerido en modo vertical | string | — | — |
| label | label for screen reader | string | — | — | | label | etiqueta para screen reader | string | — | — |
|debounce| debounce delay when typing, in milliseconds, works when `show-input` is true | number | — | 300 | | debounce | retardo al escribir, en milisegundos, funciona cuando`show-input` es true. | number | — | 300 |
## Events ## Eventos
| Event Name | Description | Parameters | | Nombre | Descripción | Parametros |
|---------- |-------- |---------- | | ------ | ---------------------------------------- | ------------------------ |
| change | triggers when the value changes (if the mouse is being dragged, this event only fires when the mouse is released) | value after changing | | change | se dispara cuando el valor cambia (si el ratón está comenzando el arrastre este evento sólo se disparara cuando se suelte el ratón) | valor despues del cambio |