Javascript Calendar

* Javascript only, runs on any website and is cross browser compatible.

* Easy to configure object oriented calendar with property based design. You can control many features by setting a simple property.

* Customizable CSS based layouts and themes, with over a dozen themes provided for you.

* Easily handle multiple events in the same day, just add two events with the same date.

* Quickly create recurring, holiday and special events.

* Supports XML data format events.

* Use with plain HTML hosting, ASP, ASP.Net, JSP, PHP, or ColdFusion

* Includes an event editor to assist creating events

Snow theme example

The basic steps to install the calendar are as follows. You can get the demo version of the calendar right now and try it for yourself.

1. Download the Scriptcalendar files. The files are delivered in a single zip file.

2. Open the zip, and upload or copy all the files and folders in the zip to your server.

3. Edit your page where you want the calendar to appear and place the following HTML tag on it. One tag is all you need to add to your page.

<!-- scriptcalendar iframe tag -->
<iframe id="scIFrame" name="abc" src="scthemes/standard/scrptcal.htm" scrolling="no" frameborder="0" width="800" height="700" >
</iframe>

4. Create the events that you want to appear in the scevent.js file. There is an editor included with the calendar to help you create your events.

And that's it. By following those instructions you can get the calendar on your website.

Of course, you can accomplish much more with calendar. You can see the user guide online for more details. It describes in great length how to install the calendar, configure it, customize the look and feel, and create all kinds of events.

Leaves theme example

You can customize the calendar to fit your overall website design. Or you can choose to use one of the existing themes. The image on the right is the leaves theme, which is red colored and has falling leaves.

All the elements of calendar are controlled by CSS. You can modify the CSS to create any effect you want. All the themes included with the calendar are simply modified CSS. There is even a printer friendly CSS so that you can print the calendar. The user guidedescribes the CSS.

In addition, the calendar exposes several properties you can set to achieve various effects. For example, you can control the month and weekday names, including the language they are in. You decide the size of the calendar. You control how the links in your event work, opening in the same page, a new window or in a DIV tag. The user guide has a complete list and description of all the properties.

You can easily create a single event in the calendar. Just add your event to the scevent.js file. You can have HTML in your event text. Use CSS class names on the events to set the background or foreground colors. You can also add a link to an event by giving the event a URL.

But how do you add special events?

Adding multiple events in a single day is a snap. Write two or more events for the same day and they will appear in that order on the calendar.

You can create events that appear every month or every year by simply omitting that part of the date. For example, an event with a year of 2010 and a day of 2 (with no month) will appear in the 2nd day of every month for 2010.

You can add holiday events like Easter and Thanksgiving (which don't occur on the same day every year) in the special event file, scspcevt.js. This file allows you to achieve all kinds of effects, like implementing a range of dates, calculating Easter every year, or writing an event to occur once every 2 or 3 days or weeks.

There is an event editor included with the calendar to help write events.

Learn more about creating events in the user guide.

See the Javascript Calendar in action.

xml calendar