CSS如何使选择选项出现在 slider 之前?

标签 css nouislider tether

我正在使用选择库 http://github.hubspot.com/select/和 noUiSlider https://refreshless.com/nouislider/ .我面临的问题如下图所示

enter image description here

我已经使用默认样式“select-theme-default.css”更改了“select”的选项,并且 slider 是在“noUislider.js”的帮助下创建的。 slider 的 z 索引比选项高,我想改变它。我尝试将“.select-option”类的 z-index 更改为 5,并尝试将“.noUi-connect”类更改为 2。但它不起作用。当我检查“.noUi-connect”并完全删除 z-index 属性时,它在某种程度上起作用了。 enter image description here

最佳答案

尝试更改 css(替换下面的 css)

.select.select-theme-default {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
    position: relative;
    z-index: 99;
}

或者你可以覆盖它

position:relative; z-index: 99;

这里是新加的

关于CSS如何使选择选项出现在 slider 之前?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49896226/

相关文章:

javascript - noUiSlider 长数舍入错误

javascript - 当目标元素不在中心时如何更改弹出箭头?

css - fa-border with fa-fw,边界内错误对齐

javascript - noUIslider 通过 slider 上的加号和减号按钮进行调整

javascript - 在 noUiSlider : Moving the slider by clicking pips now working

jquery - 尽管安装了 JQuery 和 Bootstrap,但工具提示仍不起作用

ios - 如何在越狱的ios设备上启用热点服务

css - HTML5 iframe 相对大小

javascript - 在 Drupal 7 中缩小 CSS 和 JS 文件的最佳方法是什么?

css - Bootstrap 。需要建议重新本地 CSS 文件和 CDN 链接