Start learning with our library of video tutorials taught by experts. Get started
Viewers: in countries Watching now:
This course introduces web designers to the nuts and bolts of HTML (HyperText Markup Language), the programming language used to create web pages. Author Bill Weinman explains what HTML is, how it's structured, and presents the major tags and features of the language. Discover how to format text and lists, add images and flow text around them, link to other pages and sites, embed audio and video, and create HTML forms. Additional tutorials cover the new elements in HTML5, the latest version of HTML, and prepare you to start working with Cascading Style Sheets (CSS).
And update progress simply counts this value, starting at 0--pValue starts at 0-- and it increments every time it's called. And if it's greater than 100, it resets it to 1, and then it updates the value of the progressBar and the content of text value. So let's look at this in the browser here. We're going to look at this in Firefox, because it's supported in all the different browsers, and you see there is our progressBar counting from 0 to 100 over and over again. Now, here's an interesting thing about this. This will work exactly the same if I change progress to meter.
Of course, meter isn't supported in Firefox, so we'll see our alternate content there. And I'm going to go ahead and take progress out of my style up here, and just let the idp1 be for either element. And so if I save this and open it up in Firefox, you'll notice that we just get that counting number, because Firefox doesn't support the meter element. On the other hand, if I open this in Google Chrome, it works just fine, and it just shows a meter element. So the only distinction between the meter element and the progress bar, at least from a visual standpoint--and I'm going to go ahead and put this back to the progress bar and I'll reload it, and we see we have this progress bar with this little animated thing.
I'm sure it has a different look in different operating systems. This is what it looks like on a Mac. So that's the only functional difference. The other difference is semantic, and again, HTML5 is all about semantics; at least it's very much about semantics. And so the semantics or the meter element is it's a value, and the semantics of the progress element is that it is a progress. That doesn't mean that the meter element can't change, because obviously it can. But what it means is that it's not being used as a progress bar, and that that semantic difference is going to, in some contexts, make a difference.
So this is the progress element and as of this recording, current versions of all the major browsers support the progress element except Microsoft Internet Explorer, although IE version 10--which should be out in the next few months as I'm recording this--is expected to support it.
Find answers to the most frequently asked questions about HTML Essential Training.
Here are the FAQs that matched your search "":
Sorry, there are no matches for your search ""—to search again, type in another word or phrase and click search.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.