fullCalendar basic display

This sample has just enough code to have a working fullCalendar instance.

JavaScript (fcbasic.js)

$(document).ready(function() {
    var $calendar = $("#calendar").fullCalendar();

HTML page (fcbasic.html)

        <title>Using fullCalendar</title>
        <link rel='stylesheet' href='fullcalendar/fullcalendar.css' />
        <script src='fullcalendar/lib/jquery.min.js'></script>
        <script src='fullcalendar/lib/moment.min.js'></script>
        <script src='fullcalendar/fullcalendar.js'></script>
        #calendar {
            width: 80%;
            display: block;
            margin-left: auto;
            margin-right: auto;
        .centered {
            text-align: center;

<h1 class="centered">A basic instance of fullCalendar</h1>

<div id="calendar"></div>

<script src="fcbasic.js"></script>


This gives us a month view calendar with simple navigation and plain appearance:



Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s