Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<link href='http://fullcalendar.io/js/fullcalendar-2.5.0/fullcalendar.css' rel='stylesheet' />
<link href='http://fullcalendar.io/js/fullcalendar-2.5.0/fullcalendar.print.css' rel='stylesheet' media='print' />
<script src='//cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment.min.js'></script>
<script src='//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='http://fullcalendar.io/js/fullcalendar-2.5.0/fullcalendar.js'></script>
​
<!-- the code from the JavaScript tab will go here -->
​
​
<!-- the code from the CSS tab will go here -->
​
</head>
<body>
​
    <div id='calendar'></div>
​
</body>
</html>
​
 
body {
  margin: 40px 10px;
  padding: 0;
  font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
  font-size: 14px;
}
​
#calendar {
  max-width: 900px;
  margin: 0 auto;
}
 
$(function() { // document ready
  
  $('#calendar').fullCalendar({
    header: {
      left: 'prev,next today',
      center: 'title',
      right: 'month,agendaWeek,agendaDay'
    },
    editable: true,
    //events: 'http://output.jsbin.com/xaqorutexe.js'
    events: function(start, end, timezone, callback) {
      $.ajax({
        url: 'http://output.jsbin.com/tuvinupemi.js',
        dataType: 'json',
        success: function(response) {
          callback(response.json);
        }
      });
    }
  });
  
});
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers