Переход CSS во время touchmove на устройствах iOS 7 не запускается

Классы CSS элемента x изменяются всякий раз, когда пользователь прокручивается от .stash.off до .stash.off.in и от .stash.off.in до .stash.off когда пользователь прокручивается вниз. Селектора CSS .stash , .stash.off и .stash.in определяются следующим образом:

 .stash { position: absolute; visibility: hidden; -webkit-transition: .35s; transition: .35s; -webkit-transform: translate(0, -60px); transform: translate(0, -60px); } .stash.in { visibility: visible; -webkit-transition: .35s; transition: .35s; -webkit-transform: translate(0, 0); transform: translate(0, 0); } .stash.off { position: fixed; -webkit-transition: .35s; transition: .35s; } 

Использование события scroll для выполнения переходов с помощью toggleClass() jQuery работает безупречно на рабочих столах и сенсорных устройствах. Но scroll на сенсорных устройствах запускается с помощью touchend который приносит некоторую задержку. Чтобы избавиться от этой задержки touchmove необходимо заменить scroll на сенсорных устройствах.

Но тот же JS-код, работающий со scroll , не работает на некоторых сенсорных устройствах, когда используется touchmove . Вместо анимации целевой элемент x просто появляется и выходит без какого-либо перехода. В большинстве случаев устройства Apple с iOS 7 могут быть затронуты.

Как я могу заставить переход работать на таких устройствах Apple, когда используется touchmove ?

Вот JSFiddle . Кажется, это связано.

Давайте будем гением компьютера.