Time frame

http://stephencelis.com/projects/timeframe

Please select a date range below:



and
–

Images

closebox.png

closebox-selected.png

end.png

start.png

startend.png


 
<head> 
 <link rel="stylesheet" href="timeframe.css" type="text/css" media="screen" title="timeframe" charset="utf-8">

</head>

 <body>
 <div id="example" style="margin-left: 50px">

      <h4>Please select a date range below:</h4>
      <br><br>
      <div id="calendars"></div>
      <div id="calendar_form">

        <div id="labels">
          <label for="start">Embarkation</label> and <label for="end">return</label> <a id="reset"></a>
          <!--
          
          This is Terry's hack to hide the Reset button
          
          (<a href="#" onclick="return false;" id="reset">reset</a>):
          -->
        </div>

        <div id="fields">
          <span>
            <input type="text" name="start" value="" id="start"/>

            –

            <input type="text" name="end" value="" id="end"/>
          </span>
        </div>
      </div>

  </div>
  <script type="text/javascript" charset="utf-8" src="prototype.js"></script>
  <script type="text/javascript" charset="utf-8" src="timeframe.js"></script>
<!--  Builds the calendars -->
 <script type="text/javascript" charset="utf-8">
    //<![CDATA[
      new Timeframe('calendars', {
        months: 2,
		startField: 'start',
        endField: 'end',
        earliest: new Date(),
        resetButton: 'reset',
		});
    //]]>
  </script>

</body>