1

この CSS で成功した入力範囲とスライダー オブジェクトの外観をカスタマイズしています。

input[type="range"] {
    -webkit-appearance: none !important;
    background: rgba(1,1,1,0.3);
    height:6px;
    border: solid 1px #000;
    border-bottom: solid 1px #1d1d1d;
    border-radius: 6px;
    width: 48px;
    margin: 0;
    margin-bottom: 4px;
    display: block;

}

input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none !important;
    background: -webkit-linear-gradient(top, #a2a2a2 0%,#8b8b8b 50%,#7b7b7b 100%);
    height:10px;
    width:10px;
    box-shadow: inset 0 1px 0 #C4C4C4;
    border-radius: 10px;
}

このコードは 100% 動作しますが、私がやりたいことは、スライダーの背景色 ( input[type="range"]::-webkit-slider-thumb ) を jQuery で変更できることです。

メインボックスの境界線を次のように変更できました:

$('input#volume').css('background', '#FFFFFF');

しかし、jQuery でスライダーを取得する方法がわかりません。ありがとう

(参考までに、私は Mac 上の Safari (WebKit) のみをターゲットにしているため、他のブラウザーのサポートがないため、アプリケーション用です)

4

0 に答える 0