jquery

// JavaScript Document
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>PWI Demo 8 - Picassa Webalbum Integrator (PWI)</title>

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

    <!-- These files are needed for FancyBox -->
    <link   href="js/jquery.fancybox/jquery.fancybox.css" rel="stylesheet" type="text/css"/>
    <script src="js/jquery.fancybox/jquery.fancybox.pack.js" type="text/javascript"></script>

<!-- These files are needed to display the FancyBox buttons at the top, including slideshow control --> <link href="js/jquery.fancybox/helpers/jquery.fancybox-buttons.css?v=2.0.5" rel="stylesheet" type="text/css"/> <script type="text/javascript" src="js/jquery.fancybox/helpers/jquery.fancybox-buttons.js?v=2.0.5"></script>

    <!-- These files are the PWI files -->
    <link   href="css/pwi.css" rel="stylesheet" type="text/css"/>
    <script src="js/jquery.pwi-min.js" type="text/javascript"></script>

    <!-- Needed for the Google Maps overview map -->
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>

    <script type="text/javascript">

      $(document).ready(function () {
        var settings2007 = {
          username: '<<USERNAME>>',
          albumStartDateTime: "2007-01-01",
          albumEndDateTime: "2007-12-31"
        }
        var settings2008 = {
          username: '<<USERNAME>>',
          albumStartDateTime: "2008-01-01",
          albumEndDateTime: "2008-12-31"
        }
        var settings2009 = {
          username: '<<USERNAME>>',
          albumStartDateTime: "2009-01-01",
          albumEndDateTime: "2009-12-31"
        }

        $("#container2007").pwi(settings2007);
        $("#container2008").pwi(settings2008);
        $("#container2009").pwi(settings2009);
      });

    </script>
  </head>
  <body>

    <h4>2007</h4>
    <div id="container2007"> </div>
    <h4>2008</h4>
    <div id="container2008"> </div>
    <h4>2009</h4>
    <div id="container2009"> </div>

  </body>
</html>