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 に答える