Issue 591: Automatically scroll to current time
Status:  ExportedToGithub
Owner: ----
Closed:  Aug 2015
Reported by huzaifa....@gmail.com, Aug 8, 2010
A great feature of Google Calendar in Agenda day/week view is that it identifies the current time slot as well as scrolls to that timeslot.  This would be a great feature to add to Full Calendar.

I've attached screen shots of this for both the agenda week and agenda day view.

Screen shot 2010-08-08 at 8.49.15 AM.png
56.0 KB   View   Download
Screen shot 2010-08-08 at 8.49.27 AM.png
42.7 KB   View   Download
Aug 25, 2010
Project Member #1 adamrs...@gmail.com
yeah, this feature might be good to implement at the same time as https://code.google.com/p/fullcalendar/issues/detail?id=143
Summary: scroll to current time
Sep 28, 2010
#2 tanguy.pruvot@gmail.com
i think scrolling (.focus() ?) to the next event in week view could be better... 

and yes, if there is not why not to the current hour...
Oct 7, 2010
Project Member #3 adamrs...@gmail.com
(No comment was entered for this change.)
Status: Maybe
Jan 23, 2011
#4 nzender1...@gmail.com
I was able to implement this for agendaWeek and agendaDay view using the jQuery scrollTo plugin(could be done without this plugin but was already using it) and the following piece of code in the viewDisplay callback function.

var viewName = view.name;
if(viewName === "agendaWeek" || viewName === "agendaDay"){
	var currentHour = $.fullCalendar.formatDate(new Date(), "hTT").toLowerCase();
	var $viewWrapper = $("div.fc-view-" + viewName +" div.fc-agenda-body");
	var currentHourLabel = $viewWrapper.find("table tbody tr th:contains('"+ currentHour +"')");
	$viewWrapper.scrollTo(currentHourLabel, 1);
}
Feb 13, 2012
#5 hugo.dur...@gmail.com
Hi there!

Are there any plans to put the "scroll to timeslot" feature in an upcoming release?

Thank you,
Hugo.
Mar 20, 2012
#7 adi.shou...@gmail.com
Using scrollTo plugin I did it like this:

in fullCalendar find the following code:

    $("<div style='position:absolute;width:100%;overflow-x:hidden;overflow-y:auto'/>")
    // for me it's on line#3817

Replace it with this:

    $("<div class='scrollableArea' style='position:absolute;width:100%;overflow-x:hidden;overflow-y:auto'/>")
    // just added a class

Then call the following function after the calendar has been loaded. You might have to use setTimeout in document.ready() to make sure that the function will be called after the calendar is loaded.
        // Set scroll to timeline
	function setScrollToTimeline(){		
		var curTime = new Date();
		var curHour = curTime.getHours();
		var curMinutes = curTime.getMinutes();
		if(curHour>5)
		{
			var curHoursTwelveHoursFormat = $.fullCalendar.formatDate(curTime.addHours(-5),'htt'); // converting hours to 12-hours format
			var scrollTarget = $(".fc-agenda-axis.fc-widget-header:contains('"+curHoursTwelveHoursFormat+"')")
			$('.scrollableArea').scrollTo(scrollTarget);
		}
	}


This will keep the timeline exactly in the middle of the scrollable area.
Aug 13, 2013
Project Member #8 adamrs...@gmail.com
(No comment was entered for this change.)
Summary: Automatically scroll to current time (was: scroll to current time)
Status: Accepted
Labels: -Type-Enhancement Type-Feature
Aug 15, 2013
Project Member #9 adamrs...@gmail.com
 Issue 1640  has been merged into this issue.
Aug 21, 2015
Project Member #10 adamrs...@gmail.com
Discussion for this issue has moved to the following URL:
https://github.com/fullcalendar/fullcalendar/issues/861

This is because Google Code is shutting down. Apologies if you are being pestered with these notifications. This is a one-time event.

Happy coding,
Adam
Status: ExportedToGithub