Dojo Slider
In this section, you will learn about slider and how to
create a slider in dojo.
Try Online: Slider
Slider : A slider is a GUI (Graphical User
Interface) component. In other words a slider is a scale with handle a dragged
values up/down or left/right. Calling the dojo slider by using the dojo.require("dijit.form.Slider")
that provides
dijit.form.HorizontalSlider, dijit.form.VerticalSlider and all rules
and label classes.
The following code
fills a simple textbox called horizontalSliderValue.
Here is the code of Program:
<html>
<head>
<title>Slider Example 1</title>
<style type="text/css">
@import "../resources/dojo.css";
@import "../dijit/themes/tundra/tundra.css";
</style>
<script type="text/javascript" src="dojo.xd.js" djConfig="parseOnLoad: true"></script>
<script type="text/javascript">
dojo.require("dojo.parser");
dojo.require("dijit.form.Slider");
</script>
</head>
<body class="tundra">
<b>Slider:</b>
<div id="horizontalSlider" dojoType="dijit.form.HorizontalSlider"
value="5" minimum="-10" maximum="10" discreteValues="11"
intermediateChanges="true"
onChange="dojo.byId('horizontalSlider').value = arguments[0];"
handleSrc="preciseSliderThumb.png"
></div>
</body>
</html>
|
Output of the
Program:
When you click the left side button (-) then decrease
the value of slider and click the right side button (+) then increase the value
of slider.
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Current Comments
0 comments so far (post your own) View All Comments Latest 10 Comments: