0

好吧，这是一个非常奇怪的问题，无论出于何种原因，滑块句柄在其父元素的高度或宽度的一半之外，他们为什么这样做？...

无论如何，你可以在这个小提琴中看到：http: //jsfiddle.net/PGLkW/2/那个句柄在它的容器之外，如果我想像这样删除边距：

.ui-slider .ui-slider-handle{
    width:100%; 
    margin-left:0px;
    left:0px;
    margin-bottom:0px;
}

事情变得更糟了，据我所见，我实际上需要为这样一个愚蠢的事情编辑小部件本身，或者我没有看到什么？

所以只是为了澄清我的问题，我希望句柄留在它的容器内，当我点击任何地方开始拖动时，你可以看到鼠标并没有完全移动到句柄的中间，所以它看起来真的很糟糕。

4

2 回答 2

1

看起来它没有正确读取 css，或者因为有很多解决方案他们留给开发人员玩它，你必须这样做直到你得到你想要的结果，这里有一个解决方案使用margin-bottom 为负数：

//CSS
.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl{ border-radius: 0; }
.ui-slider .ui-slider-handle{
    width: 58px;
    height: 50px;
    margin-bottom: -25px;
}

//HTML
<div class="slider" style="margin:50px; height:400px; width:50px;"></div>​

小提琴http://jsfiddle.net/RFVZ2/。我希望这对你有用。

于 2012-11-06T14:13:20.530 回答
0

该错误报告中描述了解决方案（“这是设计的”）：http ://bugs.jqueryui.com/ticket/4308

对于我使用的水平滑块：

.ui-slider-handle
{
    height: 24px !important;
    margin-bottom: -6px !important;
}
于 2015-11-02T07:35:56.370 回答