Follow the example found at
http://jqueryui.com/demos/datepicker/
and http://jqueryui.com/demos/datepicker/default.html
to make a page that uses a jQuery Date Picker. One thing to be careful about is how they link to their css and jQuery
library at the top. They use the .. notation to refer to a local hyperlink that is in a "parent" folder (one level higher);
actually for them two levels higher since they do it twice. Yours will probably have to look different.
We have a test at the beginning of the class in two weeks Feb. 21. The test will cover the first three weeks of material --
not the material presented tonight (loops and timers).
Materials:
Horse Race (Review: Uses Keyup event, if, accesses css attributes
of left and width. Also uses parseInt() method.)
AllWork.htm Compares different types of repetition: User driven
(user clicks button repeatedly); Code driven (for or while loops); and System Driven (timer calls
function repeatedly)
AllWork2.htm This program gets a little ahead and uses arrays, but someone
was going to ask for it, so I thought I'd go ahead and post it.
Color_Loop.htm Uses for loop to create a series if div with
varying color. Demonstrates how to use combinations of double quotes (for JavaScript) and single quotes (for HTML)
when dynamically adding HTML elements.
Color_Loop_Nested.htm Uses nested loops (a loop inside a loop)
to create a 2D version of above -- a series of divs, rows and columns, that change color.
Color_Loop_NestedLoop_Table.htm Again uses nested loops
to create a 2D grid that changes colors -- but uses a table instead of div's this time.
MultiplicationTables.htm Uses a select
to allow the user to pick which Times Table to display. Demos loop.
HorseRace_Timer.htm Horse race revisited replaces the
keyboard event with timer and random increments.
GPA_Calculator_1.htm Loops through set of elements containing
grade values and course credits and calculates the weighted average, i.e. GPA
Lab:
As a class Gauss summation. According to the story as a young student Carl Friedrich Gauss was in a
class where the teacher gave the assignment to sum the numbers from 1 to 100 to keep them busy and quiet. However,
Gauss solved the problem rather quickly. Design a page that allows the user to enter a beginning number and ending
number and click a button to determine and display the sum of numbers within the range. (We will use a loop rather
than any trick of Gauss.) Before calculating the script should check that each entry is a number and that the
beginning number is lower than the ending number. Also the script should remove the displayed answer if the user
changes either of the input boxes.
On your own Muybridge Film Strip. Write a page that allows the user to choose a number between
1 and 11 that corresponds to the number of frames in a "film strip". When
the button is clicked, use a for loop to construct the film strip. I used
a table, each row had three cells. The first cell holds an sprocket image
(SprocketLeft.gif); the second cell holds a horse image which changes with each
row (horse1.jpg, horse2.jpg, etc.); the third cell holds the other sprocket image
(SprocketRight.gif). I made the table's background-color to black, and I had to set
the height attribute of the images. If the user changes the number in the drop-down
select the "film strip" should be removed from the display.
(Uses MuybridgeStripImages.zip)