jQuery Mobile - How to have a transparent background for the slider?

Question

I'm trying to make a jQuery Mobile slider that has a transparent background. I would like the little "pip" on the slider to stay the same, but the purpose of this is to have the slider on top of a gradient image so that the background image could show through. Do I have to use themeroller for this? I took a look at it but couldn't figure out how to do transparency.

jQuery mobile slider docs: http://jquerymobile.com/demos/1.2.0/docs/forms/slider/

Thanks for the help!

Answer 1

The blue aura around the circle is something chrome specific. I think it can be turned off by using outline:0;

or failing that,

box-shadow:none;

However, to get rid of the bar (at least visually), I used:

border:none;

and

background:transparent;

on the class that was the slider (in that page's case, it was div.ui-slider). That was all it took to get rid of it.