2011-08-22 6 views
6

Deseo tener un control deslizante que es de 0-100, pero que sólo se puede seleccionar de 0-75 (por ejemplo)¿Hay un control deslizante javascript (jquery) que limite los valores independientemente de los valores de visualización?

Una mirada ejemplo sería algo como esto, con el deslizador restringida la entrada de la región de color

Sample limited slider

Claramente me gustaría ser capaz de establecer el máximo, mínimo, límite y el valor del deslizador ...

Por lo que yo puedo ver la interfaz de usuario jQuery deslizante no permite esto De la caja. ¡Espero que sea posible ampliar el comportamiento básico, pero necesitaría una mano muy clara para que funcione!

Respuesta

9

Puede usar el evento slide del complemento deslizante que se activa en cada movimiento del mouse durante la diapositiva. Use ui.value para obtener el valor del asa actual y verifique el límite máximo y devuelva falso. Devolver false de esta devolución de llamada impide la diapositiva.

$(".selector").slider({ 
    slide: function(event, ui) { 
     if(ui.value > 75){//Note the value of ui.value is between 0 to 99 
      return false; 
     } 
    } 
}); 

Para el color de fondo del control deslizante puede lograrlo fácilmente a través de CSS.

Cuestiones relacionadas