Carter Snowden's page which provides some examples of:
Lions | Tigers | Bears | Source |
(note that using your browser's "View Source" button will bring up a different view that what is listed below, since the server-side include directives will have been processed -- the include files will have been, well, included, and the date will have been interpreted. The "real" code for the page appears below.). Note that the file you are looking at is named "index.shtml" -- with the ".shtml" extension rather than the more familiar ".html". In the web.mit.edu environment, this extension is necessary in order to tell the server that the page has ssi directives that need to be processed. <html><head><title>example</title></head> <style> body { font-family: Arial, Helvetica, sans-serif; margin-left: 15; } h1 {font-family: Arial, Helvetica, sans-serif; font-size: 100pt; color: #6677bb } h2 {font-family: Arial, Helvetica, sans-serif; font-size: 40pt; color: #6677bb } </style> <script language="JavaScript"> var thedivs = new Array(3) thedivs[0] = "one" thedivs[1] = "two" thedivs[2] = "three" thedivs[3] = "four" function hideShow(showthis) { //hides all the divs on the page, then //shows the one requested for (var i = 0; i < thedivs.length; i++) { thisdiv = document.getElementById(thedivs[i]) thisdiv.style.visibility = "hidden" } showdiv = document.getElementById(showthis) showdiv.style.visibility="visible" } </script> <body bgcolor="ddffdd"> <!--#config timefmt="%H:%M $tflag on %m %d %y" --> <p> It's now: <!--#echo var="DATE_LOCAL" --> <br><br> <!--#include file="17s21include" --> <!-- note - "17s21include" is a file, in the same directory, that contains the snippet of html code that generates the four clickable menu items at the top of the page --> <div id="one" style="visibility: visible; position: absolute"> <h1>Lions!</h1> </div> <div id="two" style="visibility: hidden; position: absolute"> <h1>Tigers!</h1> </div> <div id="three" style="visibility: hidden; position: absolute"> <h1>Bears!</h1> </div> <div id="four" style="visibility: hidden; position: absolute"> <h2>The code for this page:</h2> <pre> <!--#include file="source_include" --> </pre> </div> </body></html>