Question

我看过几个问题，但似乎没有一个问题得到解决。我正在尝试使用noUiSlider在我的网站上实现滑动条。然而，它根本没有出现。我可以清楚地看到检查页面的时间，但在其他情况下就好像它不在那里。

这是我的代码：

<script>
    var slider = document.getElementById('slider');
    //$slider.className = 'noUiSlider';
    //$slider.id = 'slider-range';
    noUiSlider.create(slider, {
        start: 0,
        range: {
            'min': 0,
            'max': 100
        }
    });
</script>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>HELLO</title>
    <link href="{{ url_for('static', filename='nouislider.css') }}">

</head>
<body>

<script src="{{ url_for('static', filename='nouislider.js') }}"></script>


<div id="slider"></div>

</body>

</html>

任何建议或指示都会很棒。这正是他们在网站上拥有它的方式。

Answer 1

我可以通过确保在创建滑块div时指定css样式的大小来解决这个问题。

Answer 2

我知道这是一个老问题，但是我只是遇到了同样的问题。

我认为这是因为滑块的<div>目标通常没有内容，除非您为元素指定格式，否则它是不可见的。

尝试将控件随附的默认.css文件作为起点，我想您会看到滑块出现。

noUiSlider没有出现

2 个答案: