Scriptcalendar.com
An Incredible Javascript Event Calendar

User Guide

»  Table Of Contents

Cascading Style Sheet

Section 2.3.0

The scrptcal.css is the display CSS file of a theme. It controls the forecolor, background color, header and border of the calendar. below is a list of the various CSS classes found in the scrptcal.css. You are free to edit the css file or any of the individual class names contained within it.

 

class name element type description
standard classnames
body body The standard CSS body tag
A:link hyperlink The standard CSS A:link tag.
A:visited hyperlink The standard CSS A:visited tag.
A:hover hyperlink The standard CSS A:hover tag.
A:active hyperlink The standard CSS A:active tag.
main calendar classnames
.scCalendar div Applied to the main element of calendar.
.scHeader div Applied to the selectors and weekday header elements.
.scMonthDropdown combobox Applied to the month dropdown, used to control the width.
.scYearDropdown combobox Applied to the year dropdown, used to control the width.
.scSelector span Applied to the previous and next month hyperlink elements.
.scWeekNumber div Applied to the week numbers on the left side of the calendar.
.scWeekday div Applied to every date cell element of the calendar.
.scEvent div Applied to every event element of the calendar.
.scToday div Applied to "today" event defined in the scSpcEvt.js
past, present and future date classnames
.scDateDead div Applied to the dead cells of the calendar.
.scDatePast div Applied to the past cells of the calendar.
.scDateCurrent div Applied to the current cell of the calendar.
.scDateFuture div Applied to the future cells of the calendar.
event classnames
.scEventRed div Applied to event elements. Use in the scevent.js
.scEventOrange div Applied to event elements. Use in the scevent.js
.scEventYellow div Applied to event elements. Use in the scevent.js
.scEventGreen div Applied to event elements. Use in the scevent.js
.scEventBlue div Applied to event elements. Use in the scevent.js
.scEventPurple div Applied to event elements. Use in the scevent.js
.scEventBlack div Applied to event elements. Use in the scevent.js
day of the month classnames
.scNumber div Additional style applied to day of the month text.
event handler classnames
.scOnMouseOver div Applied to date cells of the calendar on the mouse over.
Popup DIV classnames
.scPopupContainer div Applied to the DIV that contains the DHTML popup iframe.
.scPopupIFrame iframe Applied to the IFrame of the DHTML popup.
Filter classnames
.scFilterContainer div Applied to the DIV that contains the DHTML popup iframe.
.scFilterItem span Applied to a span around the checkbox.
DIV tooltip classnames
.scDivTooltipBackground table Applied to the outer table of the DIV tooltip.
.scDivTooltipFont div Applied to the DIV of the DIV tooltip. Put most tooltip styles here.
.scDivTooltipForeground table Applied to the inner table of the DIV tooltip.

You may modify any of these classes in any of the themes to satisfy your needs. If you are not familiar with CSS, then you should stick with a supplied theme and do not alter it.

Armed with this CSS knowledge, you may decide to create your own theme. Perhaps none of the themes supplied work and you want something that integrates better with your website. Please feel free to create themes of your own to meet your needs.

»  Table Of Contents