[英]How to change the size of the FullCalendar js?
I am using FullCalendar js and I am a newbie. 我正在使用FullCalendar js,但是我是新手。 However, I was able to determine how get the calendar to work. 但是,我能够确定日历的工作方式。 Although, I am not able to determine how to reduce the size of the calendar. 虽然,我无法确定如何减小日历的大小。 As you can see below, I am using ColdFusion and Mura. 如您在下面看到的,我正在使用ColdFusion和Mura。 I am still new to to both and I am wondering is their a way to reduce the size of the calendar? 我对这两个人还是陌生的,我想知道他们是一种减小日历大小的方法吗?
Another issue I notice is when you click on an event on the calendar, it will display the event in a weird way. 我注意到的另一个问题是,当您单击日历上的事件时,它将以一种奇怪的方式显示该事件。 As you can see by the image, it generates that. 如您所见,它生成了图像。
I was wondering if it is possible that when you click on the date, it will appear on the below the calendar instead? 我想知道是否有可能在您单击日期时将其显示在日历下方?
Thanks 谢谢
Thanks 谢谢
<cfscript>
var calendarid = $.getbean('content').loadby(title='Events').getcontentid();
</cfscript>
<cfsavecontent variable="local.str">
<cfoutput>
<h3>Upcoming Events</h3>
<div id="UpcomingCal">
</div>
<script>
mura.loader()
.loadcss("#$.siteConfig('requirementspath')#/fullcalendar/fullcalendar.css",{media:'all'})
.loadcss("#$.siteConfig('requirementspath')#/fullcalendar/fullcalendar.print.css",{media:'print'})
.loadjs(
"#$.siteConfig('requirementspath')#/fullcalendar/lib/moment.min.js",
"#$.siteConfig('requirementspath')#/fullcalendar/fullcalendar.min.js",
"#$.siteConfig('requirementspath')#/fullcalendar/gcal.js",
function(){
$('##UpcomingCal').fullCalendar({
eventSources: [
{
url: '#variables.$.siteConfig('requirementspath')#/fullcalendar/proxy.cfc?calendarid=#esapiEncode("javascript",CalendarID)#'
, type: 'POST'
, data: {
method: 'getFullCalendarItems'
, calendarid: '#esapiEncode("javascript",CalendarID)#'
, siteid: '#variables.$.content('siteid')#'
, categoryid: '#esapiEncode('javascript',variables.$.event('categoryid'))#'
, tag: '#esapiEncode('javascript',variables.$.event('tag'))#'
}
<!---, color: '#this.calendarcolors[colorIndex].background#'
, textColor: '#this.calendarcolors[colorIndex].text#'--->
, error: function() {
$('##mura-calendar-error').show();
}
},
]
})
}
)
</script>
</cfoutput>
</cfsavecontent>
<cfreturn local.str />
It looks like your calendar is getting the size from 看来您的日历正从
<div id="UpcomingCal"></div>
Consider either putting it in a smaller container, or forcing it to be smaller. 考虑将其放在较小的容器中,或强制使其较小。 Example 例
<div id="UpcomingCal" style="width : 800px;"></div>
Height may be adjustable in the same way 高度可以用相同的方式调节
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.