Basically I have a jQuery UI range slider with 5 steps, and I want labels for each step. How would I go about this?
The only way I’ve been able to do that is by using spans and setting the margin-right of the span to position the “step marker”.here; I tossed together a demo:
http://codefusionlab.com/slider_steps.html – view page source
Not saying this method is correct – I honestly don’t know – but it gets the job done and is cross browser complaint.
You can use % instead of hard px. That way it’s more modular and can be integrated via PHP
I recently had to use a slider with marked steps in one of my projects, and I tried several times with several variations, but the the alignment does not hold when I scale the slider. In my project I used class names with the pseudo :nth selector instead of hard coding each span – but I still had to set each and every one to a PX width and margin.
You have an example, or any guidance for using %’s? I’d love to get of the fixed widths, but I’ve not had any luck in doing so.