HTML and CSS Reference
In-Depth Information
figure 6-59
style rules for the range slider
displays withou
t
waiting for the
margins to be c
le
ar of floats
reduces the font size to 0.7 em
sets the top/bottom marg
i
n to
10 pixels; centers the text
;
and
sets the width to 10 pixels
sets the width of the range
slider to 150 pixels
◗
6.
Save your changes to the file and then refresh
survey.htm
in your Web browser.
Figure 6-60 shows the appearance of the range slider in the Opera browser.
figure 6-60
range slider in the Opera browser
Exploring Form Controls with JavaScript Libraries
With the current lack of cross-browser support for many of the HTML5 form elements,
you should only use them if they are not essential to reading and successfully completing
your Web form. On the other hand, if your form requires the use of a spin box or a range
slider, you should confine yourself to HTML 4 or XHTML elements and create your own
control elements from a JavaScript library.
JavaScript libraries or JavaScript frameworks enhance HTML by adding elements and
controls created using the JavaScript language. Among the most popular frameworks
are jQuery, MooTools, Dojo Toolkit, and Yahoo! UI Library. Each provides the tools to
create enhanced form control objects such as sliders and spin boxes.
To use these tools, you have to download the JavaScript source file for the library and
usually another JavaScript program that creates the control object. Most of the libraries
work with the input elements already present in your Web form and will include docu-
mentation about how you should modify the markup tags to take advantage of a specific
JavaScript library. If you do use a JavaScript library, be aware that your users must have
JavaScript enabled to be able to use those enhanced control objects.
