jQuery toggleClass example

Toggle class name on click in jQuery

by bemulima

HTML

<script src="https://cdn.jsdelivr.net/npm/[email protected]/main.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/main.min.css">
<div id='calendar'></div>

CSS

html, body {
  margin: 0;
  padding: 0;
  font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
  font-size: 14px;
}

#calendar {
  max-width: 1100px;
  margin: 40px auto;
}

JavaScript

document.addEventListener('DOMContentLoaded', function() {
  var calendarEl = document.getElementById('calendar');

  var calendar = new FullCalendar.Calendar(calendarEl, {
    timeZone: 'UTC',
    headerToolbar: {
      left: 'prev,next today',
      center: 'title',
      right: 'dayGridMonth,timeGridWeek,timeGridDay'
    },
    editable: true,
    dayMaxEvents: true,
    events: 'https://fullcalendar.io/demo-events.json?overload-day',
    eventMouseEnter: function(info ){
    	var evt = new MouseEvent("mousedown", {
                                view: window,
                                bubbles: true,
                                cancelable: true,
                                clientX: info.jsEvent.pageX,
                                clientY: info.jsEvent.pageY,
                                /* whatever properties you want to give it */
                            });
                            info.el.dispatchEvent(evt);
    }
  });

  calendar.render();
});