How to prevent gantt scrollX when scrolling the grid in cell phone


#1

I found that when i touch move the gird in cell phone, the Gantt part will keep scroll, though i don’t want it…
And i try to specify the columns to scrollX, it make nothing in the cell phone.


#2

Hi @sapphire2k,
Unfortunately, for now, there is no way to forbid moving the timeline while scrolling the grid. It is the bug, it stays in our bug tracker, and the dev team works on a fix. Unfortunately, I cannot give you any ETA. But I will notify you when the issue will be fixed.

Regarding the second question, you can specify the scrollX for the grid(on mobile devices) only through the workaround solution.
Add the following style rules, to display scrollbars for grid and timeline. Through these scrollbars, you will be able to scroll grid without influence the timeline and vice versa:

::-webkit-scrollbar {
    -webkit-appearance: none;
}

::-webkit-scrollbar:vertical {
    width: 12px;
}

::-webkit-scrollbar:horizontal {
    height: 12px;
}

::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, .5);
    border-radius: 10px;
    border: 2px solid #ffffff;
}

::-webkit-scrollbar-track {
    border-radius: 10px;  
    background-color: #ffffff; 
}

Here is a demo(open on a mobile device/Chrome dev tools => Device toolbar) :
https://snippet.dhtmlx.com/b89d004be

It works for Safari and Chrome-like browsers. Unfortunately, it doesn’t work for Firefox:


#3

Thanks a lot and waiting for the fix.


#4

Hello Kwan,
It seems that the dev team fixed the bug when you cannot scroll the grid horizontally on the mobile devices as I cannot reproduce the issue with the 7.0.9 version in the following snippet:
http://snippet.dhtmlx.com/5/b45bbb83f