Advice on setting width of the slider to cm or inches

p5.js Coding Questions
1

Hi everyone,

I have a very basic understanding of p5.js and I am working on a program using sliders for a psychological experiment. The sliders will be used to answer questions on a scale from “nothing” to “a lot”. When doing this in paper-form , the subjects mark their response with a pencil on a line of width 10 cm. My problem is how to set-up the width of the slider so it is always a fixed length (i.e. 10 cm) independent of the resolution of the screen. Thanks a lot!

2

Hello @cperezl

You can use CSS (Cascading Style Sheets) to give an absolute length to your slider. One possible solution:

let slider = createSlider(0, 10);
slider.style('width', '10cm');

There could be potential problems, though. Absolute sizing is often avoided on the web. As an example, if you’re thinking about supporting smartphones, there’s a lot of screens out there less than 10 cm wide.

2 Likes