# Perspective Slider Low-to-High instead of High-to-Low

**URL:** <https://forum.inductiveautomation.com/t/perspective-slider-low-to-high-instead-of-high-to-low/59373>\
**Category:** Ignition\
**Tags:** perspective, ignition81\
**Created:** [May 9, 2022, 8:01pm UTC](https://forum.inductiveautomation.com/t/perspective-slider-low-to-high-instead-of-high-to-low/59373 "2022-05-09T20:01:46Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![martinel3746](https://avatars.discourse-cdn.com/v4/letter/m/e0b2c6/32.png) [@martinel3746](https://forum.inductiveautomation.com/u/martinel3746)\
**Post date:** [May 9, 2022, 8:01pm UTC](https://forum.inductiveautomation.com/t/perspective-slider-low-to-high-instead-of-high-to-low/59373/1 "2022-05-09T20:01:46Z")

</div>

Is there a setting that will reverse the numbers on a vertical slider to go from Low at the Top and High at the bottom?  
I have a vertical slider bound to a PDFViewer page and pageCount.  
It’s strange and confusing to have the slider working opposite of the page movement.  
There’s probably a property to do that but I can’t find it. Swapping the numbers and step -1 won’t do it.

---

<div class="post-metadata">

**Author:** ![josborn](https://avatars.discourse-cdn.com/v4/letter/j/4bbf92/32.png) [@josborn](https://forum.inductiveautomation.com/u/josborn)\
**Post date:** [May 9, 2022, 8:10pm UTC](https://forum.inductiveautomation.com/t/perspective-slider-low-to-high-instead-of-high-to-low/59373/2 "2022-05-09T20:10:39Z")

</div>

What about just rotating the component 180 degrees?

---

<div class="post-metadata">

**Author:** ![peter](https://avatars.discourse-cdn.com/v4/letter/p/278dde/32.png) [@peter](https://forum.inductiveautomation.com/u/peter)\
**Post date:** [May 9, 2022, 8:55pm UTC](https://forum.inductiveautomation.com/t/perspective-slider-low-to-high-instead-of-high-to-low/59373/3 "2022-05-09T20:55:53Z")

</div>

Do you mean rotating 180 degrees like this?

![Screen Shot 2022-05-09 at 2.55.05 PM](https://us1.discourse-cdn.com/inductiveautomation/original/3X/c/2/c20425a0369604e593754da3746435636c5d5a46.png)

---

<div class="post-metadata">

**Author:** ![josborn](https://avatars.discourse-cdn.com/v4/letter/j/4bbf92/32.png) [@josborn](https://forum.inductiveautomation.com/u/josborn)\
**Post date:** [May 9, 2022, 8:59pm UTC](https://forum.inductiveautomation.com/t/perspective-slider-low-to-high-instead-of-high-to-low/59373/4 "2022-05-09T20:59:32Z")

</div>

Yes, though i didn’t have labels showing on mine so i see what you are saying. You could probably rotate the lables with CSS? I’m a total novice when it comes to that though.

---

<div class="post-metadata">

**Author:** ![peter](https://avatars.discourse-cdn.com/v4/letter/p/278dde/32.png) [@peter](https://forum.inductiveautomation.com/u/peter)\
**Post date:** [May 9, 2022, 9:18pm UTC](https://forum.inductiveautomation.com/t/perspective-slider-low-to-high-instead-of-high-to-low/59373/5 "2022-05-09T21:18:42Z")

</div>

Not showing the labels in the slider component and then manually adding your own might be a good compromise.

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [May 9, 2022, 9:48pm UTC](https://forum.inductiveautomation.com/t/perspective-slider-low-to-high-instead-of-high-to-low/59373/6 "2022-05-09T21:48:49Z")

</div>

You can try this:

1. Create a new style. I called mine `sliderMarkText180`.
2. Go to _Background | Background image_ and enter

```auto
    } .slider-mark-text{transform: rotate(180deg)} {

```

1. Insert your vertical slider and set `position.rotate.angle: 180deg`.
2. Enable `style.clases: sliderMarkText180`.

This will invert the marker text but will leave them on the left side of the slider rather than on the right.  
From my experiments it seems to affect all the sliders in the view so it may not be a total solution for you.

---

<div class="post-metadata">

**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\
**Post date:** [May 10, 2022, 9:13am UTC](https://forum.inductiveautomation.com/t/perspective-slider-low-to-high-instead-of-high-to-low/59373/7 "2022-05-10T09:13:12Z")

</div>

> [@Transistor](#):
>
> From my experiments it seems to affect all the sliders in the view so it may not be a total solution for you.

To avoid that, make your selector begin with `.psc-{name-of-your-class}`, then add the class to the component style.  
You might need to slightly adjust the selector in some cases as well, depending on what the 'style' property is defined on.

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/4/d/4d4d01fa2fff188c25ef069c587962de3cf4f111.png)

If you want to put the labels back to the right of the slider, something like `} .psc-offsetlabel .slider-mark-text { right: 40px} {` could do it.