« »

Epoch is a flexible DHTML calendar that supports several display formats, such as inline on the page, as a DHTML date picker, or an calendar that with the ability to select multiple dates. Best of all, it's released under the GNU Lesser General Public License, so you can use and distribute this calendar for free inside your web pages and applications.

Label: Epoch DHTML Calendar

Report to us error of this JavaScript

Demo
Enlarge
Reload
New window

Code
Files
CSS
JavaScript
HTML
Print

Copy All x2

<LINK href="epoch_styles.css" type=text/css rel=stylesheet>
	<!--
    	This script downloaded from www.JavaScriptBank.com
    	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
	-->

Copy All x2

<SCRIPT src="epoch_classes.js" type=text/javascript></SCRIPT>

<SCRIPT type=text/javascript>
/*You can also place this code in a separate file and link to it like epoch_classes.js*/
	var bas_cal,dp_cal,ms_cal;      
window.onload = function () {
	bas_cal = new Epoch('epoch_basic','flat',document.getElementById('basic_container'));
	ms_cal  = new Epoch('epoch_multi','flat',document.getElementById('multi_container'),true);
	dp_cal  = new Epoch('epoch_popup','popup',document.getElementById('popup_container'));
};
</SCRIPT>
	<!--
    	This script downloaded from www.JavaScriptBank.com
    	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
	-->

Copy All x2

<H3>Inline calendar:</H3>
<P><!--webbot bot="HTMLMarkup" startspan -->
<DIV id=basic_container></DIV><!--webbot bot="HTMLMarkup" endspan i-checksum="19186" -->
<P></P><PRE><B>Code:</B> var calendar = new Epoch(&#39;cal&#39;,&#39;flat&#39;,document.getElementById(&#39;container&#39;),false);</PRE>

<H3>Inline calendar with multiple date selections (rows and columns):</H3>
<P><!--webbot bot="HTMLMarkup" startspan -->
<DIV id=multi_container></DIV><!--webbot bot="HTMLMarkup" endspan i-checksum="19600" -->
<P></P><PRE><B>Code:</B> var multiselect_calendar = new Epoch(&#39;cal&#39;,&#39;flat&#39;,document.getElementById(&#39;container&#39;),true);</PRE>
<H3>Date picker calendar:</H3>
<P><!--webbot bot="HTMLMarkup" startspan -->

<FORM id=placeholder action=# method=get><INPUT id=popup_container> <INPUT onclick=dp_cal.toggle(); type=button value=pick> </FORM><!--webbot bot="HTMLMarkup" endspan i-checksum="56464" --></P><PRE><B>Code:</B> var popupcalendar = new Epoch(&#39;cal&#39;,&#39;popup&#39;,document.getElementById(&#39;inputid&#39;),false);</PRE>
<P>Epoch Calendar supports automatic date formatting â�� US, European, or create 
your own!</P>
	<!--
    	This script downloaded from www.JavaScriptBank.com
    	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
	-->