Lösen Sie schnell jquery.touch. Nach links und rechts wischende und vertikale Bildlaufleistenkonflikte_jquery

Dieser Artikel teilt Ihnen die Lösung für den Konflikt zwischen den linken und rechten Schiebe- und vertikalen Bildlaufleisten von jquery.touchSwipe mit. Der spezifische Inhalt ist wie folgt

Html5 benötigt lediglich eine Funktion, die zwischen links und rechts umgeschaltet werden kann, die Funktion der Bildlaufleiste nach oben und unten muss jedoch beibehalten werden. Ich habe das jquery.touchSwipe-Plugin auf dem mobilen Endgerät verwendet. Nachdem ich lange online gesucht hatte, musste ich es selbst ändern, und schließlich funktionierte es.

Erstes Bild:

Die Lösung besteht darin, dass ich die Links- und Rechts-Scroll-Ereignisse zum Body hinzugefügt und das vertikale Scrollen des DIV für die Auf- und Ab-Aktivitäten verwendet habe. Obiger Code:

$("#body").swipe( { fingers:'all', swipeLeft:swipe1, swipeRight:swipe2} );
  function swipe1(event, direction, distance, duration, fingerCount) {
   tab_shipu(-1); //向左滑动你要执行的动作 
  }
         
  function swipe2(event, direction, distance, duration, fingerCount) {
    tab_shipu(1);  //向右滑动你要执行的动作
  }

Dann setze ich die Bildlaufleiste des Div nach oben und unten

<div id="cook" class="cook"></div>
<style>
  .cook{
    overflow: auto;
  }
</style>

Legen Sie den Standard-Höhencode für Körper und Div fest:

$("body").css("height",document.body.scrollHeight);
$(".cook").css("height",document.body.scrollHeight-$('#cook').position().top);

Das Obige beschreibt, wie der Konflikt zwischen der linken und rechten Schiebeleiste und der vertikalen Bildlaufleiste gelöst werden kann. Ich hoffe, dass es für das Lernen aller hilfreich sein wird.