In-Class Examples for CS 312

firstPage.html - very simple HTML example
formatting.html - simple formatting example including headings, line breaks, and paragraphs
links.html - examples of including absolute and relative links
lists.html - examples of creating unordered, ordered, and definition lists
images.html - examples of including images on webpages
table.html - tables with borders, headings, and blank cells
table-attr.html - tables with different sized borders, cellpadding, cellspacing, and width
table-fancy.html - tables with colspan, rowspan, color, widths, and nested tables

mypage.html - basic HTML page that will be formatted using CSS style defined in mystyle.css
mystyle.css - external CSS definition file

relative.html, relative.css - demonstrates relative positioning
absolute.html, absolute.css - demonstrates absolute positioning
fixed.html, fixed.css - demonstrates fixed positioning
layout-abs.html, layout-abs.css - demonstrates difference between absolute and relative positioning in a layout
layout-rel.html, layout-rel.css - demonstrates difference between absolute and relative positioning in a layout
float.html - example with one floating image
float2.html - exmaple with three floating images
two-column.html, two-column.css - demonstrates two-column layout
three-column.html, three-column.css - demonstrates three-column layout

form.html - demonstrates the use/construction of forms
plainText.cgi (source) - simple Perl script
finding-coord.html - using CGI scripts to determine image map coordinates (uses mapCoord.cgi)
mapCoord.cgi (source) - Perl script used by finding-coord-example.html to print out map coordinates (actually just prints out input query)
php.html - simple PHP example that calls 1action.php (source)

(Examples modified from http://www.w3schools.com)

write-head.html - JavaScript in the <head> section
write-body.html - JavaScript in the <body> section
getelementbyid.html - example of using document.getElementById to write text to webpage
alert.html - example of using alerts and functions
prompt.html - example of using prompts
passing-args.html - example of passing arguments to a function
validate.html - example of using JavaScript to validate form data
greeting.html - changing the page background color based on the time of day
click.html - example of the onclick event and using an external JavaScript file (js/externalFunction.js)
countdown.html - countdown clock (until the final exam!)

(Examples modified from http://www.w3schools.com)

plant_catalog.xml - XML file containing a list of plants (with no styling plant_catalog-plain.xml)
plants.xsl (txt) - XSLT specification for styling the plant_catalog.xml file
xmlHelperFns.js - JavaScript helper functions for using XMLHttpRequest and parsing XML
text-noreload.html - Example of XMLHttpRequest to change a document without a re-load
get-header.html - Using XMLHttpRequest to view the HTTP response header
plant-parser.html - Example of using JavaScript for parsing XML
plant-table.html - Example of using JavaScript to create a table out of XML elements
plant-app.html - Slightly more advanced example with XML and JavaScript

(Examples modified from http://www.w3schools.com)

(Examples modified from http://www.w3schools.com)

suggest.html - Dynamic suggestion box with AJAX, uses gethint.php (source)
plants.html - Dropdown box displaying plant info with AJAX and PHP5, uses getPlant.php (source)

php-form-get.html - Using PHP with forms and the "get" method, uses action-get.php (source)
plants-xpath-more.php - More examples using PHP, Simple XML, and XPath to read XML (source, XML)

clickToHide.html - hide all <p> elements on the page
effects-ex.html - examples of jQuery effects: hide, show, slideDown, slideUp, fadeTo, fadeOut, fadeIn, animate
methods-ex.html - examples of jQuery modifing HTML: html, append, prepend, after, before
css-ex.html - examples of jQuery modifing CSS
ajax-ex.html - examples of jQuery using AJAX, uses echo.php (source)

In-Class Examples for CS 312, Fall 2011