Lukes XHTML Compliant Template (relative URL) Lukes XHTML Compliant Template (absolute URL) A HTML 5 compliant template Bad Teacher (with bad markup) Really Bad Web Page with no markup A Really Really Bad Web Page with no markup and no extension Indenting WITHOUT tab (does source look any different?) Indenting with a tab (does source look any different?) Indenting with a tab this time using another editor called EditPlus (does source look any different?) Bad Teacher Indenting StudentCode1 StudentCode2 StudentCode3

UTF 8 Experiments Experimenting With Header Tags Block versus Inline Pre, Block, Address Some Inline Elements Regular Spaces Non Breaking Spaces

Example Links Example Links w/ namedAnchorExample Relative URL Tutorial Image Example Thumbnail Image Map Image Map With Highlights The Big Mac Index

Basic Table Table Header Table Layout Table demoing colspan, rowspan Basic Post Form Basic Get Form Buttons Input Types Radio versus Checkboxes Drop Down Lists Text Areas tabindex

Style sheets. Three types of CSS Font size Styling an element, an id and a class Multiple elements, adjacent siblings Descendents Example Text example page 278 Text example page 278 using classes Pseudo Classes Styling Lists Child Selectors, Director Child Selectors and Descendants. Assignment 5 Template Horiz Navbar

Slide 9 and 10 demoing how margins and padding effect background and content. Box Model: demoing padding, positive margins and negative margins. Classic float example Some idiosyncratic float behaviour Block elements, floating, margin collapse btwn elements, clearing Margin Collapse btwn Parent and Child Elements Margin Collapse with grids Centering text, centering elements Relative versus Absolute Positioning Drop Effect Using Absolute Positioning and z-index Creating Font Shadows More on absolute positioning: debunking a common misconception. CSS Hover
Door County Labs, Schemas, Examples
Door County Lab Door County Screenshot Door County Schema Two Column Layout Two Column Schema Two Column Layout Using Two Floats Skyscrapers mini lab
Overflow, three column liquid layout. Liquid Height, Container - contained. Horiz Nav
Vertical Centering 1 Vertical Centering 2
President Header Problem

Bootstrap Exercise Bootstrap Exercise (W3Schools CDN) Bootstrap Exercise (Local Bootstrap Library) Bootstrap Exercise (Local Bootstrap Library) Zip Assign7 (presidents) Tables with CSS Chapter 9 Examples Twitter Bootstrap Responsive Design With ViewPort Responsive Design WITHOUT ViewPort Bootstrap SELFIES Bootstrap Version 3.3.3 SELFIES, JumboTron, One Page, Using CDN, Bootstrap Version 3.3.3 SELFIES, Carousel, One Page, Using CDN and carousel.css

Hello World Three places where JavaScript can be written My first variables Declaring variables / types of variables / loosely defined My first function (and event) Load Time Error Run Time Error Footer Demo
Control Structures
Conditional For loop While loop Switch and parseInt()
Mini Lab One (Debugging) Mini Lab Two (Debugging)
Concepts/Skills needed for JavasScript Week 2 Assignment
Styling objects with JavaScript (frequent method and preferred method) Set Time Out Math.round Math.random body onload form onsubmit innerHTML (and other attributes) Return Example Return Example Debug This Example Loading info into a document Focus Delay Submit Listening for Return Key
Concepts/Skills needed for JavasScript Week 3 Assignment
Prereq: Iterating through an array Accessing Form Data (looping through an array collection) Access the link collection Checking to see whether a radio button has been checked Three Ways to Reference Radio Buttons To Fixed Advanced: traversing the DOM // adding and removing nodes
Misc
Comparison versus strict comparison Chapter 11 Chapter 12

Creating Your Own JavaScript Objects
JavaScript Object Demo // console.log demo Using a constructor, a method, looping through an array of objects A simple object Another simple object Creating an object with literal notation Lesson about objects presented last week of Spring 2014

Some Dom Manipulation Using Add Child Etc.
Getting Elements By Tag Name Getting Elements By Class Name Adding a node Adding multiple nodes, removing them, adding and removing attributes

Phone Number Validation Using Regex Email Validation Using Regex Global Regex Phone Validation Using Split Fish Rollover Images Selector Conflict Variable Scope
Mini Labs
Check or Uncheck all boxes Enlarge Images

Flash Cards Template Morning Spring 2014 Flash Cards Template Afternoon Spring 2014 Flash Cards Template Fall 2014

Post Example Proctor Request (using 844 zip demo on Chi) Proctor Object Returned From Server PHP page that returns list of xhtml or css tests

Some jQuery widgets and effects
Calendar Tabs Whose Content Comes From Another Page PHP Page With Conditionals Accordion (all closed) with some wierd bouncing Slide Menu Dialog Box Style 1(Notice the different style) Dialog Box Style 2

MISC
Test List Post 2 Example

jQuery Mobile
Demo Site

CSS 3
Transform and box shadow Rounded Corners Offset border box model Multiple Columns nth Child

HTML 5
Form elements Geo Location Geo Location with Google Map Drag and Drop (on W3Schools) Web Storage (on W3Schools) Web Storage (on icarus) shoppingCart1 template shoppingCart2 template Node append Login / Session Cookie Minilab

CSS Tables
CSS Tables W3Schools Spec