SLIDER CIRCOLARE JAVASCRIPT

Dimostrazione dal vivo

Puoi vedere la demo dal vivo qui

aggiorna pip su mac

Caratteristiche

più cursori all'interno di un contenitore (vedi immagine demo sopra)
valore min/max con dimensione del passo specificata
rilasciare il gestore del cursore prima di raggiungere il valore del passo completerà automaticamente il passaggio
il callback di modifica del valore riporta il valore corrente in modo dinamico in base alla posizione del dispositivo di scorrimento
impostando il valore trascinando il gestore o toccando il punto sul cursore

utilizzo

Basta aggiungere un collegamento al file css nel tuo |_+_|:

Quindi, prima della chiusura |_+_| tag aggiungi il file javascript dalla cartella dist:

Gestori di pacchetti

Devi ancora importare i file css

Una volta installati/aggiunti i file, puoi creare un'istanza del dispositivo di scorrimento:

Impostazioni

# Bower bower install --save @mougli/circular-slider

npm install @mougli/circular-slider

Importante! Si prega di notare che il raggio è relativo alla dimensione del contenitore: 200 è il massimo e indica il 100% del contenitore. Il dispositivo di scorrimento regolerà automaticamente la dimensione del contenitore. Raggio 200 significa che il cursore toccherà i limiti.