FullCalendar Scheduler滚动到当前日期 [英] FullCalendar Scheduler Scroll to current date

问题描述

我正在使用具有1年视图的Scheduler.因此，我可以水平滚动查看1月1日至12月31日之间的每一天.

次要问题是水平滚动始终处于初始位置(一直到最左端)，因此始终显示1月1日.是否有办法在初始加载时滚动到当前日期或月份?

我一直在寻找jQuery，通过查找当前日期和 ScrollLeft 到元素来滚动浏览它.但是似乎标题与滚动容器是分开的，所以不确定如何工作.

解决方案

对于2.6.1版

  eventAfterAllRender:函数(视图){var viewStartDate;如果(view.name =='yearView'){viewStartDate = new Date(new Date().getFullYear()，0，1);}否则，如果(view.name =='twoMonthView'|| view.name =='oneMonthView'){viewStartDate = new Date(new Date().getFullYear()，new Date().getMonth()，1);}如果(view.name =='oneWeekView'){$('.fc-body .fc-time-area .fc-scrollpane').children('div').scrollLeft(4 * 12 *(moment().weekday()-1)* view.options.slotWidth);}别的 {var dateDiff =(new Date().setHours(0，0，0，0)-viewStartDate)/(1000 * 60 * 60 * 24);$('.fc-body .fc-time-area .fc-scrollpane').children('div').scrollLeft(Math.round(dateDiff)* view.options.slotWidth);}} 

这是2.6.1版的主要部分

  var dateDiff =(new Date().setHours(0，0，0，0)-viewStartDate)/(1000 * 60 * 60 * 24);$('.fc-body .fc-time-area .fc-scrollpane').children('div').scrollLeft(Math.round(dateDiff)* view.options.slotWidth); 

在3.0版或更高版本中，HTML的结构不同.滚动元素已更改.

  $('.fc-body .fc-time-area .fc-scroller-clip .fc-scroller').scrollLeft(Math.round(dateDiff)* view.options.slotWidth) 

可能将其降低到

  $('.fc-scroller').scrollLeft(Math.round(dateDiff)* view.options.slotWidth) 

I'm using the Scheduler with a 1 year view. So I can see every day from Jan 1 to Dec 31 by scrolling horizontally.

Minor issue is that the horizontal scroll is always at the initial position (all the way left) so it always display Jan 1. Is there a way for it to scroll to the current date or month on the initial load?

I was looking into scrolling through it with jQuery by finding the current date and ScrollLeft to the element. But it seems that the header is separate from the scrolling container so not sure how that would work.

解决方案

For version 2.6.1

eventAfterAllRender: function (view) {
    var viewStartDate;
    if (view.name == 'yearView') {
        viewStartDate = new Date(new Date().getFullYear(), 0, 1);
    }
    else if (view.name == 'twoMonthView' || view.name == 'oneMonthView') {
        viewStartDate = new Date(new Date().getFullYear(), new Date().getMonth(), 1);
    }

    if (view.name == 'oneWeekView') {
        $('.fc-body .fc-time-area .fc-scrollpane').children('div').scrollLeft(4 * 12 * (moment().weekday() - 1) * view.options.slotWidth);
    }
    else {
        var dateDiff = (new Date().setHours(0, 0, 0, 0) - viewStartDate) / (1000 * 60 * 60 * 24);

        $('.fc-body .fc-time-area .fc-scrollpane').children('div').scrollLeft(Math.round(dateDiff) * view.options.slotWidth);
    }
}

This is the main part in version 2.6.1

var dateDiff = (new Date().setHours(0, 0, 0, 0) - viewStartDate) / (1000 * 60 * 60 * 24);

$('.fc-body .fc-time-area .fc-scrollpane').children('div').scrollLeft(Math.round(dateDiff) * view.options.slotWidth);

In Version 3.0+ the structure of the HTML is different. The element to scroll on has changed.

$('.fc-body .fc-time-area .fc-scroller-clip .fc-scroller').scrollLeft(Math.round(dateDiff) * view.options.slotWidth)

Can probably reduce it down to

$('.fc-scroller').scrollLeft(Math.round(dateDiff) * view.options.slotWidth)

这篇关于FullCalendar Scheduler滚动到当前日期的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！