Freeze the first section of timeline view


#1

Hi,

Is there a way to freeze the first section of timeline view ?
(like excel sheet : others sections can be scrolled but the first section fixed at the top of the list)

Thanks,


#2

Hi @anassder,
there is no built-in way in the scheduler to “freeze” the first line. You can do it with your own code. The better way is to change the style of HTML elements of the “first line”:

.dhx_matrix_line” // for the timeline 
.dhx_matrix_scell” // for the grid

The code may look like this fragment:

function lineFixer(){
  var firstMatrixLine = document.querySelector(".dhx_matrix_line"); // timeline
  var firstTableLine = document.querySelector(".dhx_matrix_scell"); // grid
  firstMatrixLine.style.position = "fixed";
  firstMatrixLine.style.zIndex = 5000;
  firstMatrixLine.style.top = 102;
  firstTableLine.style.position = "fixed";
  firstTableLine.style.zIndex = 5000;
  firstTableLine.style.top = 102;
  firstTableLine.style.background = "white";
}

Note, the additional styles will be removed after onClick, onCellClick, onBeforeDrag, onDragEnd, onAfterLightbox, onAfterSchedulerResize, onViewChange events fire, so you will have to apply these styles back after these events. You can see the result in the sample:

http://snippet.dhtmlx.com/5/c51ac7e2e

One more thing, as it is a “custom” solution some difficulties could occur in different timeline configurations, and this solution may need some fixes.


#3

Thank you @Ales for this solution, but unfortunately I can’t use it, because I should disable smart rendering option :confused: in order to keep first section container in the DOM.


#4

Hi @anassder,
sorry for the delay, but this is a non-trivial case. There is no builtin way to fix current sections, but it is possible to it via redefining some internal functions. I need else more time to prepare a working sample.


#5

Hello @Ales

Ok I’ll be waiting.

Thank you very much !