locked
Metro :How to change Slider Controls Style?

    Question

  • hi everyone~

    I want to change Slider Controls  style ? The  WinJS controls default Style is  below:

    But I want to change the ticks width ?

    Friday, April 27, 2012 5:17 AM

Answers

  • Hi Sith,

    This is the Range control.  This sample will show you how you can modify the control:

    HTML essential controls sample         

    There is not an example of styling the tooltip, however you would just style it similar to the thumb.  For the equalizer sample they turn it off completely:

    input[type="range"].eq::-ms-tooltip
    {
        display: none;
    }

    But you could change the color or even add a unique backround image (perhaps turning off the border) using standard CSS techniques!

    -Jeff


    Jeff Sanders (MSFT)

    Wednesday, May 2, 2012 11:49 AM
    Moderator

All replies

  • and how to change Popup style?

    thanks~


    • Edited by Sith Go Friday, April 27, 2012 9:36 AM
    Friday, April 27, 2012 5:24 AM
  • Hi Sith,

    This is the Range control.  This sample will show you how you can modify the control:

    HTML essential controls sample         

    There is not an example of styling the tooltip, however you would just style it similar to the thumb.  For the equalizer sample they turn it off completely:

    input[type="range"].eq::-ms-tooltip
    {
        display: none;
    }

    But you could change the color or even add a unique backround image (perhaps turning off the border) using standard CSS techniques!

    -Jeff


    Jeff Sanders (MSFT)

    Wednesday, May 2, 2012 11:49 AM
    Moderator
  • thanks a lot ~   :)
    Thursday, May 3, 2012 5:40 AM