pensé que la sintaxis básica de un deslizador era:deslizante jQuery UI que no aparece
<div id="slider"></div>
$("#slider").slider()
Pero eso no lo hace un control deslizante visible. Al inspeccionar el elemento div, veo que se aplicaron algunos estilos, pero el control deslizante no está visible.
Aquí es un violín: http://jsfiddle.net/yqNcn/
No ha incluido la CSS para jQuery UI por lo que las clases se aplican pero estilos no lo son (en realidad hay ninguno que se apliquen). Here's un violín editado que incluye los estilos (mira el panel de Recursos); el control deslizante es visible como debería ser.
Eso es extraño, jsfiddle no se ocupa de eso aunque haya marcado la casilla de verificación jQuery UI. Eso es un error o no realmente pensado ... jQuery UI es más que código JS. – sg3s
primera importación javascript archivos * jquery.s e importación widget de jQuery UI Jquery-ui.js Entonces Ponga su Css Div Etiqueta con Identificación<div id="slider"></div> este Ejemplo
<div id="slider"></div>
entonces llamada a la función deslizante jQuery ....
<script>
$(function() {
$("#slider").slider();
});
</script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script>
$(function() {
$("#slider-range").slider({
range: true,
min: 1000,
max: 1000000,
values: [ 75000, 300000 ],
slide: function(event, ui) {
$("#amount").val("$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ]);
}
});
$("#amount").val("$" + $("#slider-range").slider("values", 0) +
" - $" + $("#slider-range").slider("values", 1));
});
</script>
</head>
<body>
<p>
<label for="amount">Price range:</label>
<input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;">
</p>
<div id="slider-range"></div>
Bonito, copia de demostración de jQuery UI copiada, y no está funcionando. Solo puedo adivinar que jsfiddle cometió un error. – sg3s