We talked about radio button and just wanted to show you some old car radio pic like this one.
So you pick one out of many choices with a radio button. This is good for a handful of choices... If you have a longer list (such as choosing a state out of 50 states), you are better off with a combo box (or the <select>).
Notice that there are value for each entry and a display name and they can be different.
Let's talk about lists. You can do a un-ordered list <ul> with bullets.
The 3 primary colors are
- red
- green
- blue
- ham
- egg
- green onion
Next, we are going to talk about tables. Often we have the need to line up things, and HTML is hard to do that without the table. Yes, you can use <pre> tag such as the following but it isn't so pretty?
Shrimp Fried Rice $7.50 Egg Foo Young $5.00
Here is a table, built with <table> then 2 rows, built with <tr> then table data with <td>
| Shrimp Fried Rice | $7.50 |
| Egg Foo Young | $5.00 |
Yes you can add width to control width. You can add background color, and alignment. You can also turn on border. You can add cellpadding and cellspacing too.
You can also do column span and row span.
Column span example:
| Lunch | |
| Shrimp Fried Rice | $7.50 |
| Egg Foo Young | $5.00 |
Row span example:
| First Name: | Vivian Chan |
|---|---|
| Telephone: | 312 333 4444 |
| 312 333 5555 |
Here is one other tag you need to know: <!-- comments --> Things in there don't get displayed, but useful to store notes. In javascript, comments are made by a single line // or wrapped with /* */.
Ok, I am going to turn attention to javascript function. Javascript can do math operations.
| Operation | Operator |
| + | + |
| - | - |
| × | * |
| ÷ | / |
The '+' can be used to put text together. Some language is harder to do text adding(such as C).
One way to see a function is a list of instructions that you can "call" when you need. It takes one or more parameters and can return a value (or none). Functions are good for breaking down tasks into sub-tasks.. or do some operation then give you 1 value. Functions can have their own local variables. BTW, a semicolon is not required end of each statement but I think it is good idea to do that.
var b=1;
function add3(n) {
return n+3;
}
//see http://mathworld.wolfram.com/Paraboloid.html
function paraboloid(x,y) {
var b=2;
alert("paraboloid b="+b);
return b*(x*x+y*y);
}
// if you call this many times, for example, x=-5 to 5, y=-5 to 5 and get a z value then plot it you will get a graph like in the link above.
// how you show 3D objects to 2D will require some more-advanced math here I hope you will eventually get to.. in college.
// another example of function
function toCelsius(fahrenheit) {
return (5/9) * (fahrenheit-32);
}
alert(add3(7)); // shows 10
alert(add3(1)+add3(2)); // shows 9
alert(toCelsius(212)); // shows 100
alert("b="+b); // shows 1
var z = paraboloid(0,0);
alert("b="+b); // will it be changed to 2?
Rather than alert, chrome and firefug can use console.log