Hi skar,
there are two ways to style a widget, which apply to the Slider as well:
1. Set the properties directly
You can style the background by setting properties on the slider. You
can access the knob using
slider.getChildcontrol("knob"). The background of a widget is usually
defined using the "decorator" property.
2. Use themes
You can define the look of a slider using the appearance theme. This is
how the slider is styled in the framework:
"slider" :
{
style : function(states)
{
var decorator;
var focused = !!states.focused;
var invalid = !!states.invalid;
var disabled = !!states.disabled;
if (focused && invalid && !disabled) {
decorator = "input-focused-invalid";
} else if (focused && !invalid && !disabled) {
decorator = "input-focused";
} else if (disabled) {
decorator = "input-disabled";
} else if (!focused && invalid && !disabled) {
decorator = "border-invalid";
} else {
decorator = "input";
}
return {
decorator : decorator
}
}
},
"slider/knob" :
{
include : "button-frame",
style : function(states)
{
return {
decorator : states.disabled ?
"scrollbar-slider-horizontal-disabled" :
"scrollbar-slider-horizontal",
shadow: undefined,
height : 14,
width : 14
};
}
},
> Hi,
>
> How do I set a background image/color to the slider and also color/image
> to the slider's knob?
>
> see http://vps.net/ for an example slider I like to emulate. It has the
> custom knox, thinner slider bg and also markings for the possible step
> values.
>
> For me, the step values aren't important. But I'd like to customize the
> knob and the rest of the slider to have different bg color and also an
> image for the knob and another image repeated inside the slider bg.
>
> cheers,
> skar.
>
>
--
Fabian Jakobs
JavaScript Framework Developer
1&1 Internet AG - Web Technologies
Ernst-Frey-Straße 9 · DE-76135 Karlsruhe
Telefon: +49 721 91374-6784
[email protected]
Amtsgericht Montabaur / HRB 6484
Vorstände: Henning Ahlert, Ralph Dommermuth, Matthias Ehrlich, Thomas
Gottschlich, Robert Hoffmann, Markus Huhn, Hans-Henning Kettler, Dr. Oliver
Mauss, Jan Oetjen
Aufsichtsratsvorsitzender: Michael Scheeren
------------------------------------------------------------------------------
Join us December 9, 2009 for the Red Hat Virtual Experience,
a free event focused on virtualization and cloud computing.
Attend in-depth sessions from your desk. Your couch. Anywhere.
http://p.sf.net/sfu/redhat-sfdev2dev
_______________________________________________
qooxdoo-devel mailing list
[email protected]
https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
