Hello ,
I just fixed the above functionality using custom coding,
just in case it would help some one i am pasting the code snippet over here,
function my_wp_fullcalendar_header_yearskip(){
global $post;
$script_load_page_string = get_option('wpfc_scripts_limit');
$script_load_page_array = explode(',', $script_load_page_string);
if(in_array($post->ID, $script_load_page_array)){ ?>
<div class="uk-modal" id="uk-event-popup">
<div class="uk-modal-dialog">
<button type="button" class="uk-modal-close uk-close"></button>
<div class="uk-modal-header">
<h2 id="eventTitle">Headline</h2>
</div>
<div id="eventBody" class="uk-modal-spinner"></div>
<div class="uk-modal-footer uk-text-right">
<a href="#">Event Page</a>
</div>
</div>
</div>
<script type="text/javascript">
jQuery(document).on('wpfc_fullcalendar_args', function( e, options ){
options.header.left = 'prevYear,prev,next,nextYear today';
options.eventClick = function(event, jsEvent, view){
var modal = UIkit.modal("#uk-event-popup");
modal.show();
var data = {
'action': 'wsi_event_details',
'event_id':event.event_id
}
jQuery.post(wsis.ajax_url,data,function(resp) {
jQuery('#eventTitle').html(event.title);
jQuery('#eventBody').html(resp);
jQuery('#eventUrl').attr('href',event.url);
jQuery('#eventBody').removeClass('uk-modal-spinner');
})
return false;
}
jQuery("#uk-event-popup").on({
'hide.uk.modal': function(){
jQuery('#eventBody').html('');
jQuery('#eventBody').addClass('uk-modal-spinner');
}
})
});
</script>
<?php
}
}
add_action('wp_footer','my_wp_fullcalendar_header_yearskip', 1);
here i am using uikit modal popup , you can modify the code as per your requirments.