2

3D 変換を使用して phonegap アプリにページ スライダーを実装したので、高速です。

見栄えがよく、正常に機能しますが、ページを左右(x軸)を含む任意の方向にスクロールできることに気付きました。しかし、どういうわけかそれを防ぐ必要があります.Javascript/CSSまたはios/androidのいずれかで、ユーザーがx軸でスクロールするのを防ぐ方法はありますか? そうでなければ、彼は簡単に次の画面にドラッグできます。

次の CSS を使用して、div のリストをコンテナーに配置し、それらをすべて右側に配置するだけです。

.page {
  background-color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  -webkit-transform: translate3d(100%, 0, 0);
  transform: translate3d(100%, 0, 0);
  padding: 10px 10px 30px 10px;
  -webkit-transition-duration: .25s;
  transition-duration: .25s;
}

次に、x トランジションを 0% にリセットする別のクラスを使用するため、右から左にスライドし、現在のページは中央から左に -100% スライドします。しかし、ここで問題になるのは touchmove イベントによるスクロールだけです。

何か案が?

アップデート:

それはまだ機能していないので。より多くの情報を提供します。私のHTMLは次のようになります。

... ... ...

私のページクラスのCSSを知っています。私のコンテナIDには次のルールがあります:

#container {
  position: absolute;
  width: 100%;
  height: 100%;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
4

1 に答える 1