jquery – 滑块工具提示的重叠部分及其在bootstrap-slider插件中的位置

我在模态窗口中使用Twitter Bootstrap 2.3.2和bootstrap-slider插件.问题是滑块的工具提示的一部分重叠在模态窗口的标题后面并且位置错误.

我试图添加此规则,但它没有帮助.

.slider .tooltip{
    z-index: 1151 !important;
}

我想提供正确的jsfiddle,但我无法找到bootstrap-slider插件cdn.这是jsfiddle,它不起作用,因为缺少bootstrap-slider插件源.

jsfiddle

HTML

JavaScript的

$(document).ready(function () { 
            $('#nodeSize').slider({
                    formatter: function(value) {
                            return value;
                    }
            });

            $('#edgeSize').slider({
                    formatter: function(value) {
                            return value;
                    }
            });
});

最佳答案

将其添加到您的Javascript：

$("body").on("shown.bs.modal",function() {
    $("#edgeSize").slider('relayout');
    $("#nodeSize").slider('relayout');
});

说明：当显示模态时,函数relayout在两个输入字段上运行,并在初始化后再次呈现工具提示.

资料来源：https://github.com/seiyria/bootstrap-slider#functions

更新了JSfiddle：http://jsfiddle.net/0sryor13/3/

原文地址：https://www.jb51.cc/css/427198.html

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [e-mail] 举报，一经查实，本站将立刻删除。