Web Page Design and Implementation CSCI 145 Fall 2002 Forms Top of Page Basic Forms Basic forms information Submit/reset Submit and reset Text Text inputs Textarea Textarea inputs Radio Buttons Using radio buttons to change an image Radio Buttons Radio buttons change form elements using events and DOM Checkbox Checkbox inputs Select Simple select / option example Select Multiple select Select Navigating using button and select inputs (and DOM) More Forms Top of Page Hidden Values Passing hidden fields using JavaScript Hidden Values JavaScript to parse query string and pass to another form Validation Validate form data with JavaScript before passing it Variables Variables passed in query string Query String Parsing JavaScript to analyze query string - used in form examples Javascipts Top of Page Basic javascript Basic Javascript using document write Basic javascript Basic Javascript using document write with styles Functions Javascript function call with document & styles Javascript objects Javascript time and date object Javascript objects Javascript time and date object using functions Session Information Javascript navigator, window, document classes Session Information Javascript navigator, window, document classes Session Information Javascript with timer - annoying Open New Windows Top of Page Switch URL Javascript link to new page with variable Open & Close New Window Automatically open second window with timed close Close only Window Attempt to close only browser window after time out Open New Window Create document and new window with FORM tag button Open New Window Select which new window to open with FORM tag buttons Mouse Overs Top of Page Status line Use a mouseover to set the status line Status line Use a mouseover to set the status line and clear it Status line Use a mouseover function call to set status line Status line Use a mouseover function call with parameter to set the status line Images Mouseover an image calling function to set status line Change Image Mouseover an image calling function to change image Change Images Mouseover function to swap images Change Images Mouseover function to swap images and change status line Change Images Mouseover functions removing annoying line in NN More Mouse Overs Top of Page Multiple Images Mouseover functions with multiple links and images Multiple Images Mouseover functions with multiple links and images Multiple Images Mouseover multiple links and images With names Mouseover multiple links and images with object names With objects Mouseover object names and eval experssion More Mouseover More mouseover samples More Mouseover More mouseover samples Link Subject Sample 1 Basic HTML - Headings, Horizontal Rules Sample 2 Basic HTML - Centering, tag attributes Sample 3 Basic HTML - BODY attributes Sample 4 Basic HTML - Preformatted text Sample 5 Basic HTML - bold, big, blink, italic,...   Table Table Basic - Borders, Cellpadding, Cellspacing, Valign, Rowspan, Colspan List 1 Basic unordered list List 2 Ordered list List 3 Nested lists List 4 Nested lists List 5 Nested lists List 6 Nested lists List 7 Definition lists     Table Sample 0 Spanning and Sizing - the pieces Table Sample 1 Spanning and Sizing - what it should look like Table Sample 2 Spanning and Sizing - borders to see it Table Sample 3 Spanning and Sizing - end product       Frame Page 1 Simple Frames Frame Page 2 Simple Frames Basic Style Introduction to 'style' tag Style class Simple global styles, specific and class Style class Simple global styles, specific, class, spanning, nesting Style class Simple global styles, specific, class, spanning, nesting Style class Simple global styles, specific, class, spanning, nesting Style nesting 1 Nesting styles Style nesting 2 Nesting styles Style nesting 3 Nesting styles Cascading Styles 1 Global and inline, margins, backgrounds Cascading Styles 2 Global and inline, margins, backgrounds Cascading Styles 3 Global and inline, margins, backgrounds Cascading Styles 4 Global and inline, margins, backgrounds Cascading Styles 5 Global and inline, margins, backgrounds Inline Style Simple inline style example Embedded Style Simple embedded style example External Style Simple external file style example Font and Text Font and text properties for CSS	Samples Assignments Gradebook Home Page Samples Syllabus
Tick Tock	ranger@ ecst.csuchico.edu
Assignments | Gradebook | Home Page | Samples | Syllabus