How can I increase slider thickness (height) to make it easier to click on? | XM Community
Skip to main content

Hi,
I have chosen to hide the slider handle until the slider is clicked in order to avoid anchoring in my survey. However, the slider is so narrow that clicking on it is rather difficult. Does anyone know how I can increase the thickness (i.e. height from bottom to top) of the slider bar?
Many thanks in advance,
Zak
Screenshot 2022-05-11 at 16.03.31.png

Hi there, try adding the below to the CSS in your survey's Look & Feel:
.Skin .horizontalbar .Slider .track {
height: 30px;
}

.Skin .horizontalbar .Slider .td.BarOuter {
height: 60px;
}

.Skin .horizontalbar .Slider .handle {
height: 50px;
}
Adjust the height values as needed. To adjust the height for specific sliders, you can add the below as JavaScript to the question:
jQuery(".track").css("height", "30px");
jQuery("td.BarOuter").css("height", "60px");
jQuery(".handle").css("height", "50px");

Thanks Tom, that worked the charm

Leave a Reply


Terms & Conditions