Week and Month View
The calendar view supports variable weeks. Save space by only displaying one or two weeks or go for a full month where it makes sense. Use the type and size properties of the view option to set the size of the month or week view.
You can also set the first day of the week using the firstDay option, where Sunday is 0, Monday is 1, etc.
Demo
Configure month or week view
Month view
Week view
weeks
Set the first day of week to
mobiscroll.eventcalendar('#calendar', {
firstDay: 1 ,
view: {
calendar:
{
labels: true,
type: 'week ',
size: 2
}
}
}); 
JSHTML
mobiscroll.setOptions({
locale: ,
theme: ' ',
themeVariant: ' '
});
var one;
var two;
var three;
one = mobiscroll.eventcalendar('#demo-one-week-view', {
view: {
calendar: { type: 'week' },
},
});
two = mobiscroll.eventcalendar('#demo-two-week-view', {
view: {
calendar: { type: 'week', size: 2 },
},
});
three = mobiscroll.eventcalendar('#demo-three-week-view', {
view: {
calendar: { type: 'week', size: 3 },
},
});
mobiscroll.getJson(
'https://trial.mobiscroll.com/events/?vers=5',
function (events) {
one.setEvents(events);
two.setEvents(events);
three.setEvents(events);
},
'jsonp',
);
<div class="mbsc-grid">
<div class="mbsc-row">
<div class="mbsc-col-sm-12 mbsc-col-md-4">
<div class="mbsc-form-group">
<div class="mbsc-form-group-title">One week view</div>
<div id="demo-one-week-view"></div>
</div>
</div>
<div class="mbsc-col-sm-12 mbsc-col-md-4">
<div class="mbsc-form-group">
<div class="mbsc-form-group-title">Two week view</div>
<div id="demo-two-week-view"></div>
</div>
</div>
<div class="mbsc-col-sm-12 mbsc-col-md-4">
<div class="mbsc-form-group">
<div class="mbsc-form-group-title">Three week view</div>
<div id="demo-three-week-view"></div>
</div>
</div>
</div>
</div>