info343/minilabs/7/minilab7.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
   
   <head>
      <!--
      minilab7.html
      Skeleton for Mini-Lab 7: Special Effects
      INFO 343, Autumn 2012
      Morgan Doocy
      -->
      <title>Mini-lab 7: Special Effects</title>
      
      <style type="text/css">
         body {
            font-family: "Lucida Grande", "Lucida Sans", Calibri, sans-serif;
            text-align: center;
            width: 100%;
            height: 100%;
         }
         #catchme {
            position: absolute;
            width: 80px;
            height: 80px;
            background-color: red;
            border: dashed 2px blue;
            left: 50%;
            top: 50%;
            margin-top: -40px;
            margin-left: -40px;
         }
      </style>
      
      <link href="minilab7.css" type="text/css" rel="stylesheet" />
      
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

      <!-- This links to your JavaScript file, minilab7.js -->
      <script type="text/javascript" src="minilab7.js"></script>
   </head>
   
   <body>
      <h1>Mini-lab 7: Special Effects</h1>
      
      <div id="catchme">
         Catch me if you can!
      </div>
   </body>
   
</html>