theLoveLogic
New Member
I am customising the look of an input-range and the slider object which I have done successfully with this CSS:\[code\]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;}\[/code\]This code works 100%, however what I want to do I be able to change the background color of the slider (input[type="range"]::-webkit-slider-thumb) with jQuery.I've been able to change the border of the main box with:\[code\]$('input#volume').css('background', '#FFFFFF');\[/code\]But I can't figure out how to get the slider with jQuery.Thanks(FYI I am only targeting Safari (WebKit) on a Mac hence the lack of other browser support, its for an application)