Я создал сетку с фиксированным заголовком. Я реализовал функцию мгновенной прокрутки в сетке, чтобы можно было прокручивать сетку как по вертикали, так и по горизонтали с помощью прокрутки.
scroll-snap-type: both mandatory;
Тем не менее, ее можно прокручивать по диагонали, когда направление прокрутки имеет диагональ, то есть не хочу
Вот определение структуры сетки:
grid-template-areas:
"date1 date2 date3"
"d1-p1 d2-p1 d3-p1"
"d1-p2 d2-p2 d3-p2"
"d1-p3 d2-p3 d3-p3";
Например, его можно прокрутить от d1-p1
до d2-p2
, от d1-p2
до d2-p1
и т. Д. c ..
Когда пользователь проводит пальцем по экрану по диагонали, я бы хотел отменить прокрутку оси x или y, после сравнения, какая прокрутка оси больше или нет.
Например, пользователь проводит пальцем по 100px влево и На 50px вверх, затем сетка прокручивается только горизонтально влево, а правая часть сетки прокручивается, потому что перемещение по оси x больше, чем у.
Примечание. В настоящее время это сделано только для мобильных устройств, поэтому я не гарантирую поведение в браузере настольного компьютера.
Вот JsFiddle .
Не могли бы вы дать мне некоторую подсказку, чтобы добиться этого? Заранее спасибо.