1

私のプロジェクトの現在の状態は、こちらの jsFiddle で確認できます。
スライダーの動作をほんの少しマッサージしたいと思います。
X値が各スライダーの中心から登録されるように、それらを微調整する方法を探しています。

ご覧のとおり、スライダーは入力の値を適切に設定しますが、X 値が「中心質量」ではなくリーディング エッジに従っているため、少し不自然に見えます。
スライダーをできるだけ左に動かすと、短く止まるように感じます。できるだけ右に移動すると、境界を超えているように感じます。

本当に厄介なハックを想像することもできると思いますが、より専門的なアプローチを好むでしょう:)
私の考えは最初にCSSに行きました（少しだけ微調整したいと思っていました）が、今のところうまくいきません.
私の推測では、JS ソリューションに要約されると思います。

何か考え/アイデアはありますか？

4

1 に答える 1

1

変換によって x 値を変更せずに位置を調整できます。必要なのは、transform属性を追加することだけです...

    <rect id="rect_slider_knob"
         class="slidable"
         width="4%"
         height="24%" 
         y="38%"
         rx="2%"
         ry="3%"
         stroke="#666" 
         transform="translate(-6, 0)"
    />

ここでデモを見ることができます: http://jsfiddle.net/mzmRN/

PS これはかなり素晴らしいウィジェットなので、あなたのフィドルの相互作用を改善せずにはいられませんでした。気にしないでください!

于 2012-06-27T05:25:13.950 に答える