[Outsystems UI]Carousel hide arrow

Hi,

I would like to know how to hide the left arrow button on the first slide and hide the right arrow button on the last slide. I've searched  many ways but no luck so far.

FYI, I'm using Outsystems 11 UI.


Thank you.

Hi Hailey,

Try to apply this on the screen where you are using the carousel:

.carousel .carousel-navigation.disabled {
    display: none;
}


Let me know if this helps,

Pedro

Pedro Marques wrote:

Hi Hailey,

Try to apply this on the screen where you are using the carousel:

.carousel .carousel-navigation.disabled {
    display: none;
}


Let me know if this helps,

Pedro

Hi Pedro,

Thank you for your reply, but unfortunately the code above didn't work. 


 

Hi Hailey,

This has worked for me, see the file attached.  

Can you share your oml?

Pedro Marques wrote:

Hi Hailey,

This has worked for me, see the file attached.  

Can you share your oml?


Hi Pedro,

Attached is the oml file. WebScreen1 and WebScreen 2 are the same. 


Thank you.


Hailey

Solution

Hi Hailey,

Try this one instead:


.carousel .carousel-arrow-right[aria-disabled=true] {

  display: none;

}


.carousel .carousel-arrow-left[aria-disabled=true] {

  display: none;

}


It worked for me in your oml.


Hope this helps,
Pedro

Solution

Hi Pedro,

Thank you. It works.

Hope you have a great day!!!!


Best,

Hailey

Glad it worked :) 

If you want to apply it to every carousel and not just the one in that screen apply the code to your application theme.


Have a great day!


Pedro