php - モバイルのホーム画面のような Web ページで div をスライド

Question

アプリのように機能するモバイル マイクロサイトを構築しています (タッチ操作あり)。

次のように、ユーザーがスワイプできるようにしたいほぼフルスクリーンの div を持つドロップダウン メニューがあります。

---

---

動作しているスワイプイベントを取得するためにjQuery Mobileライブラリを含めましたが、divがスムーズにスライドせず、時々完全に消えてしまい、ページを更新する必要があります.

上の図の例では、スワイプで div #1 が完全に左にスライド (非表示) し、次にdiv #2 が同じ方向にスライド (表示) されますが、それは div #1 が完全に非表示になった後でのみです。2 つのイベントが同時に発生する必要があるため、div #1 と #2 の間にギャップはありません。

消える問題に関しては、何が原因なのかわかりません、申し訳ありません。ここにいくつかの関連コードがあります...

JavaScript:

$('#menu').on('swipeleft', 'div', function(event) {
    $('#' + nextPage($(this).attr('id'),'l')).show('slide', { direction: 'right' }, 500);
    $(this).hide('slide', { direction: 'left' }, 500);
});
$('#menu').on('swiperight', 'div', function(event) {
    $(this).hide('slide', { direction: 'right' }, 500);
    $('#' + nextPage($(this).attr('id'),'r')).show('slide', { direction: 'left' }, 500);
});

これを行うためのより良い方法があれば、私はすべて耳にします。

ありがとう！