Issue 1996: zooming calendar causes events to miss-align
Status:  Released
Owner: ----
Closed:  Aug 2014
Reported by d...@onvelocity.com, Sep 14, 2013
Behavior varies depending on wether or not the calendar's width changes or not. You may need to "play" with it to reproduce. I found the steps below in Chrome on a Mac to be pretty consistent. Also, confirmed on IE8.

Steps:
1. zoom to smallest size using browser control + minus keys
2. zoom up once using browser control + plus keys
Observe: 2:30 event shows up closer to 3pm
Observe: 5:00 event shows up closer to 6pm
Expect: events to be aligned with their respective times

http://jsfiddle.net/javadoug/T5mHV/
Sep 14, 2013
#1 d...@onvelocity.com
I suggest removing the check that prevents fc from redrawing the events during a window resize event, which is triggered when the page zooms.

https://github.com/arshaw/fullcalendar/pull/132
Oct 8, 2013
Project Member #2 adamrs...@gmail.com
(No comment was entered for this change.)
Status: Reproducing
Oct 8, 2013
Project Member #3 adamrs...@gmail.com
(No comment was entered for this change.)
Labels: Type-Bug
Nov 15, 2013
#4 yat.c...@gmail.com
I can confirm that it doesn't align as expected when I hold down the command + minus keys to zoom out quickly, but it does align correctly when I press it zoom out slowly one level at a time. Press command + 0 to zoom to 100% destroys the alignment even when it was aligned correctly before.

I see a few cases where sometimes the 2:30pm event is closer to 3pm sometimes it's closer to 2pm, and sometimes it's completely off (around the 5pm mark). Not sure how to accurately reproduce each case though, as following your steps directly doesn't work for me.
Jun 7, 2014
Project Member #5 adamrs...@gmail.com
 Issue 2101  has been merged into this issue.
Jun 7, 2014
Project Member #6 adamrs...@gmail.com
 Issue 2109  has been merged into this issue.
Jun 11, 2014
Project Member #7 adamrs...@gmail.com
(No comment was entered for this change.)
Status: Accepted
Jun 15, 2014
Project Member #8 adamrs...@gmail.com
(No comment was entered for this change.)
Labels: milestone-skeleton
Jun 25, 2014
#9 van.wijg...@mdxs.net
Confirmed  issue 1996  remained in Fullcalendar v2.0.2 using http://jsfiddle.net/wijgerden/CV47W/ (based on Fullcalendar 2 Debugging Template, but updated to v2.0.2 files).

Tested with http://jsfiddle.net/wijgerden/CV47W/embedded/result/ in particular, using the following (updated) steps:

1. zoom browser to normal zoom level using [Ctrl]+[0]
2. reload the fiddle (or embedded result) using [Ctrl]+[F5]
3. observe 10:30 meeting and 12:00 lunch are properly aligned
4. zoom browser in quickly keeping [CTRL]+[-] pressed down to smallest
5. observe 10:30 meeting and 12:00 lunch non-alignment
6. zoom up using [Ctlr]+[+]
7. observe 10:30 meeting and 12:00 lunch non-alignment
8. zoom browser to normal zoom level using [Ctrl]+[0]
9. observe 10:30 meeting and 12:00 lunch: often properly aligned, sometimes non-aligned
10. zoom browser in step-by-step using [CTRL]+[-] down to smallest
11. observe during zoom steps non-alignment sometimes occurs
12. reload the fiddle (or embedded result) using [Ctrl]+[F5]
13. zoom browser to normal zoom level using [Ctrl]+[0]
14. observe 10:30 meeting and 12:00 lunch non-aligned

Especially steps 10-14 should allow reproduction of the issue. Summary: zoom to smallest level, force reload the fiddle (embedded result), use [Ctrl]+[0] to bring browser to normal zoom level, observe issue.

I've tested and confirmed the bug in the following environments:
a. Chrome 35.0 on Windows 8.1 (desktop)
b. Firefox 30.0 on Windows 8.1 (desktop)
c. Firefox 30.0 on Xubuntu 14.04 (inside VMware)
Jun 25, 2014
#10 van.wijg...@mdxs.net
Initially having some issues to run the fiddle (and the fiddle embedded result) in Internet Explorer 11.0 on Windows 8.1 (desktop), found that direct use of http://fiddle.jshell.net/wijgerden/CV47W/show/light/ does load the fiddle output in IE11 and allows testing.

Note that [Ctrl]+[0] may not accept the numpad [0] (at least on my machine) but does accept the regular [0] on my keyboard... this seems IE11 specific; weird.

Now the good news is that IE11 on Windows 8.1 does *NOT* seem to have any problem with the zooming in/out, so this bug/issue might not be reproducible on IE11.


Jul 23, 2014
Project Member #11 adamrs...@gmail.com
This is fixed in v2.1 (beta)
http://blog.arshaw.com/1/post/2014/07/fullcalendar-210-beta.html

I would really appreciate if you could verify this. Thanks a lot!
Jul 24, 2014
#12 van.wijg...@mdxs.net
Sorry to report that it doesn't seem to be fixed in v2.1 (beta).

Confirmed that  issue 1996  remained in Fullcalendar v2.1 (beta) using http://fiddle.jshell.net/wijgerden/LKWXF/ (based on Fullcalendar 2 Debugging Template, but updated to v2.1.0-beta files using http://rawgit.com/ to turn the github resources into CDN resources; see http://stackoverflow.com/a/24548325/2315612). In this fiddle, I've also removed the jquery-ui external resource.

Tested with http://fiddle.jshell.net/wijgerden/LKWXF/show/light/ in particular, using the steps as described above (in my 2014-Jun-25 post).

I've tested and confirmed the bug to remain in the following environments:
a. Chrome 36.0 on Windows 8.1 (desktop)
b. Firefox 30.0 on Windows 8.1 (desktop)
c. Firefox 30.0 on Xubuntu 14.04 (inside VMware)

It does NOT seem to be an issue in IE11 on Windows 8.1.

Jul 27, 2014
Project Member #13 adamrs...@gmail.com
Yeah, i can see that thing still misalign.. thanks. fill get this fixed before official release
Aug 4, 2014
Project Member #14 adamrs...@gmail.com
ok, this should be fixed for real in the second beta release
http://blog.arshaw.com/1/post/2014/07/fullcalendar-210-beta.html

can u try it out plz?
Aug 11, 2014
#16 van.wijg...@mdxs.net
Happy to report that this has been fixed in v2.1.0-beta2.

See http://fiddle.jshell.net/wijgerden/tezqwt7x/ which uses the v2.1.0-beta2 files (now using commit specific CDN resources).

Use http://fiddle.jshell.net/wijgerden/tezqwt7x/show/light/ for testing.

Steps to confirm that this has been fixed:

1. zoom browser to normal zoom level using [Ctrl]+[0]
2. reload the fiddle (or embedded result) using [Ctrl]+[F5]
3. observe 10:30 meeting and 12:00 lunch are properly aligned
4. zoom browser in quickly keeping [CTRL]+[-] pressed down to smallest
5. observe 10:30 meeting and 12:00 lunch - FIXED: are properly aligned
6. zoom up using [Ctlr]+[+]
7. observe 10:30 meeting and 12:00 lunch - FIXED: are properly aligned
8. zoom browser to normal zoom level using [Ctrl]+[0]
9. observe 10:30 meeting and 12:00 lunch - FIXED: are properly aligned
10. zoom browser in step-by-step using [CTRL]+[-] down to smallest
11. observe during zoom steps - FIXED: that alignment is properly maintained
12. reload the fiddle (or embedded result) using [Ctrl]+[F5]
13. zoom browser to normal zoom level using [Ctrl]+[0]
14. observe 10:30 meeting and 12:00 lunch - FIXED: are properly aligned

Expect: events to be aligned with their respective times
Problem: none - FIXED: they are aligned in v2.1.0-beta2

I've tested and confirmed the issue to have been resolved using:
a. Chrome 36.0 on Windows 8.1 (desktop)
b. Firefox 31.0 on Windows 8.1 (desktop)
c. Firefox 31.0 on Xubuntu 14.04 (inside VMware)

I've also tested using IE11 on Windows 8.1 and confirmed it works as expected.
Aug 11, 2014
#17 antonio....@gmail.com
Confirmed as fixed

Tested on Chrome 35.0 on Windows 7
Tested on Firefox 31 on Windows 7

Aug 14, 2014
Project Member #18 adamrs...@gmail.com
thank you so much for testing and confirming
Aug 14, 2014
Project Member #19 adamrs...@gmail.com
(No comment was entered for this change.)
Status: Implemented
Aug 26, 2014
Project Member #20 adamrs...@gmail.com
This issue has been resolved with the official release of v2.1.0:
http://blog.arshaw.com/1/post/2014/08/fullcalendar-210-released.html

Please post any follow-up bug reports or feature requests as separate issues. Thanks.
Status: Released
Sep 25, 2014
#21 damien.b...@gmail.com
Hi there,

I'm using the 2.1.1 version of fullcalendar, and this not seems to be working.
When I configure my calendar with :

var calendar = $('#calendar').fullCalendar({
                theme: true,
                defaultView: 'agendaWeek',
                contentHeight:'auto',
                aspectRatio: 2,
               // other stuffs                
});

The events are not well aligned (see attachment).

The issue i found  (quite dirty, but works) was to delay the call to the view :
1. init the calendar in other view than wanted ('month' for instance)
2. delay the 'changeView':
    setTimeout(function (){$('#calendar').fullCalendar('changeView','agendaWeek');}, 10);

Waiting for a fix!

Working on Mac OS, chrome version 7.0.2062.124
bug_fullcalendar.png
36.2 KB   View   Download
Oct 30, 2014
Project Member #22 adamrs...@gmail.com
hey damien, would you mind reposting this as a new issue, and provide an online demonstration? (see http://fullcalendar.io/wiki/Reporting-Bugs/). Thanks!