My favorites | Sign in
Project Home Issues
New issue   Search
for
  Advanced search   Search tips   Subscriptions
Issue 610: Option to not have scroll bar in week and day views
6 people starred this issue and may be notified of changes. Back to list
Status:  Duplicate
Merged:  issue 521
Owner:  ----
Closed:  Aug 2010


Sign in to add a comment
 
Reported by yowza...@gmail.com, Aug 19, 2010
I'm placing a FullCalendar inside of an area that already has a scroll bar. When I switch to week or day view, the FullCalendar scroll bar shows up right next to the div's scroll bar. This doesn't present the nicest UI.

I've been able to get rid of the scroll bar with this CSS:
.fc-agenda-body { height: auto !important; }

However, the vertical lines dividing days in week view and the yellow color of today stop at the height of the calendar view. Overriding the CSS for .fc-agenda-bg to auto height doesn't work, as it becomes only one text line in height. So I hacked some jquery code to set the height of fc-agenda-bg to the height of fc-agenda-body plus fc-agenda-head:

	$(".fc-agenda .fc-agenda-bg",$calendar).each(function(){
		$this = $(this);
		$this.height($this.prev().height() + $this.prev().prev().height());
	});

This works for now, but it seems like this could all be more elegantly handled by the plugin itself if it had an option such as:
	allowScrolling: false

If it helps, my calendar is inside a layout using the UI.Layout plugin. Here's an example (make sure to resize your browser to force the middle panel to have a scroll bar, then switch to week or day view):
http://issues.tauren.com/fullcalendar/demo.html

Less important, but eventually I'd like to have the top calendar navigation be in a separate non-scrolling div. UI.Layout allows multiple header and footer divs that are not scrolling, so moving the navigation into it would be cleaner. I'm going to try to just move it using jquery dom manipulation and see if it will continue to work, but have a feeling it won't since it will no longer be inside of my #calendar DOM element. 

Example of non-scrolling headers is here:
http://layout.jquery-dev.net/demos/table_fixed_header.html

Aug 20, 2010
#1 travisco...@gmail.com
agreed.  I JUST posted this exact feature request, not finding yours before posting. 
Aug 21, 2010
#2 yowza...@gmail.com
@traviscooper: great minds think alike! But really, I totally agree with you, having two scrollbars is quite confusing, not only to new users, but seasoned users alike. An option to disable scrollbars would be welcomed.
Aug 25, 2010
Project Member #3 adamrs...@gmail.com
(No comment was entered for this change.)
Status: Duplicate
Mergedinto: 521
Sep 13, 2010
#4 travisco...@gmail.com
Adam, is there any way we could maybe offer you some direct cash advance for some of these features to be prioritized over others?  ;) 
Jun 2, 2011
#5 fag...@syonet.com
Hey, I saw this issue and I think I found a better solution:

In Calendar.js replace the method calcSize() with the modified one in the attachment.
In AgendaView.js replace the method setSize() with the modified one in the attachment.

If you write height: 'auto', then the scroll will not appear. And if you pass height: '700px' it will work (that wasnt working and it should be like jquery http://jsfiddle.net/qNVDS/)

-Fagner
a.txt
1.4 KB   View   Download
Aug 26, 2011
#7 aron.duby@gmail.com
This is definitely a very annoying problem. I'm using the month, agenda week, and agenda day views. The two agendas views aren't showing the all day slot. I used the below in the config for the viewDisplay callback. 

viewDisplay: function(view) {
	var n = view.name,
		body_h = $('div.fc-view-'+n+' > div > div > div').height();


	$('div.fc-view-'+n+' > div > div, div.fc-view-'+n+' .fc-agenda-days').height(body_h + 20 +'px');
	$('div.fc-view-'+n+' .fc-agenda-days thead th').height(20);
}

The 20 is based on the height of the headers. I ended up setting it manually due to cross browser issues. So far I've tested this in FF6, Chrome 13, IE8 & IE7 (I have no intention of looking at it in ie6). The only issue is IE7 doesn't properly set the height of the headers, so the line for 12am is on top of 12:30am and it looks like 12am is part of the header. Event's happening at 12am still display properly though.
Jul 26, 2013
#8 shrikant...@gmail.com
can we do resource colomn freeze or scroll freee

Sign in to add a comment

Powered by Google Project Hosting