Slider with scale needed - any ideas?

[dloew]

Hi there,

my application uses slider controls as shown here:
http://extjs.com/deploy/dev/examples/slider/slider.html

Now I have to implement a slider with a scale, showing the possible values of the slider (as shown in the attachement).

I looked through the ux-forum but I didn't find a solution or something similiar.

The Extjs slider example shows an custom slider with an static image as scale (without numeric values) but I need to set min and max-values dynamically, so that's no solution.

Any help, idea or advice is appreciated.

[Animal]

Write a plugin which inserts some extra stuff into the widget.

[dloew]

Hi there,

I wrote a plugin for the slider component.
It shows a range / scale under the slider inner element.

I attached an example. I tested it with Ext js V 2.2.1.
(You can run the example from the examples directory)

I think there's a little bug in the slider component. Following scenario:
increment 10, minvalue = -100.
The moving of the thumb doesn't work in the range from 0 to -100.

Greetings

[Animal]

Top marks for initiative!

It does looks like an Ext bug with snapping when the value is less than zero.

You should probably report it in the Bugs folder.

[moegal]

Hi there,

I wrote a plugin for the slider component.
It shows a range / scale under the slider inner element.

I attached an example. I tested it with Ext js V 2.2.1.
(You can run the example from the examples directory)

I think there's a little bug in the slider component. Following scenario:
increment 10, minvalue = -100.
The moving of the thumb doesn't work in the range from 0 to -100.

Greetings

dkoew,

Is there any way to do this with just css and no external images? Perhaps a bar (|) or some other standard character like | ¦ • or even ^

The tick doesn't always show depending on the theme.

Thanks, Marty

thanks,
Marty

[astorne]

thanks dloew。 it's my modification on dloew's work。

The slider ruler is used to be as the reference rule rof the report table to control the page margins and show the cell size ..., the max value changes with the page size and as the thumb drag it's scale will be redraw(the thumb place is the zero point)

[sanhita123]

not working