CCIS Quick Links goes to a page with links to:
This page uses the concept of expandable/collapsible sections. With this technique, an overview of the content of a site may be given using headers and the details may be revealed by opening particular sections.
Here are two other examples:
CS 1100 Excel Strings Tutorial
CS 1100 Access Queries Tutorial
To enable expandable/collapsible sections, you need
one CSS file
expandable.css,
one Javascript file
expandable.js,
and two images:
an expand-icon
and a collapse icon
.
All “expandable” code files and images
are in one subdirectory
expandable of the top level directory.
This design makes it efficient to download, install, and use the “expandable” code.
To Download the “expandable” code, click on the Download link.
To see how to use expandable/collapsible sections on a typical web page, use your browser’s View Source menu item to see the html source of this web page.
The Story Utility enables a web-based slide show in which each slide is a fully functional web page. This utility is similar to PowerPoint but is much more powerful because each slide may have its own dynamic behavior. In many ways, this utility is a web-descendent of the Apple Hypercard program.
Each web-based slide show is driven by a story file that provides a list of the links to each web page that forms a slide in the slide show. Each link should be provided with a title that allows the slide to be identified.
Here is a link to the Story Utility that gives full directions and the ability to download the code as a zip file:
The link below provides examples of stories related to web development. Although you may not be interested in the details of the content, the examples show the potential of the Story Utility to organize lots of information.
The section below shows the Synchronized Google Maps web application in two flavors: Northeastern University maps and satellite views of the major league baseball parks. The section also documents the web application using the Story Utility.
Synchronized Google Maps Plain
Synchronized Google Maps for Northeastern University
Synchronized Google Maps for Major League Baseball Parks
Synchronized Google Maps for Northeastern University (standard and mobile)
The Synchronized Google Maps User Interface
The Synchronized Google Maps Story
Web Development Course ASP.NET Demo Site
Personal Home Page on the CCIS Site
The JPT 2.7 Library File jpt.jar
The JPT 2.7 Annotated Tutorial and Source
Due to changes in browser behavior since 2008, the links to the JPT source files in the tutorial above may or may not be displayed in the browser. In some cases, the files may be downloaded instead.