Modifying display interactively


show more Modifying display interactively provides you with in-depth training on Web. Taught by Joseph Lowery as part of the HTML5 Projects: Engaging Ecommerce show less
please wait ...

Modifying display interactively

As noted earlier, the basic range input type is lacking any way of showing the current value of that range control. In the previous lesson, we added a text field to hold the value. In this lesson, we will bring in some basic JavaScript to link the range element to the text field. Let's head over to the code editor, and we want to scroll all the way down to below the footer, where I'm going to put in a basic script tag, so I'll make an extra line after footer and close off the tag, and Aptana gives me my closing tag.

Let me just open that up a little bit and scroll down so you can see what's going on. Now we're going to define the function that I've called Print Value, that will set up a couple of variables to get the ID of the slider, as well as the one from the text field. And once we have that, we'll be able to set one value to the other. So we start with a function and as I said, I'm going to call this printValue.

And the first argument is sliderID, tex...

Modifying display interactively
Video duration: 3m 34s 37m 29s Intermediate

Viewers:

Modifying display interactively provides you with in-depth training on Web. Taught by Joseph Lowery as part of the HTML5 Projects: Engaging Ecommerce

Subject:
Web
Software:
HTML JavaScript CSS
Author:
please wait ...