1

我是 NoUISlider 的新手,我已经设法让滑块正常工作。但是,滑块值不可见或似乎有效。

我也是 jQuery 新手,所以我不确定为什么滑块值代码不起作用。

我正在编辑的网站就在这里:Experian Map

这是我的代码:

<script>
$(function(){

  $('#slider-range').noUiSlider({

    range: {
        'min': 0,
        '10%': 10,
        '20%': 20,
        '30%': 30,

        '50%': 50,
        '60%': 60,
        '70%': 70,

        '90%': 90,
        'max': 100
    },
    snap: true,
    start: [20]
	});
});
    </script>

<script>
  $(function(){
	$('#slider-range').Link('lower').to($('#slider-range-value'));
</script>
.example-val{
    color: #FFF;
    display: block;
    margin: 15px 0px;
}

.example-val:before {
    content: "Value: ";
    font: 700 12px Arial;
 }   

 #slider-range-value{
  	color: #FFF;
 }
    	<div id="slider-range"></div><span id="slider-range-value" class="example-val"></span>    

4

1 回答 1

0

逻辑没问题,但是你有几个语法错误。打开浏览器控制台(按 F12)会有所帮助。

固定代码:

$(function(){
    $('#slider-range').noUiSlider({
        range: {
            ...
        },
        snap: true,
        start: [20]
    });

    $('#slider-range').Link('lower').to($('#slider-range-value'));
}); // << was missing
于 2014-09-24T12:47:38.460 回答