Selesaikan jquery.touchLeret ke kiri dan kanan gelongsor dan bar skrol menegak conflicts_jquery

WBOY
Lepaskan: 2016-05-16 15:05:22
asal
1918 orang telah melayarinya

Artikel ini berkongsi dengan anda penyelesaian kepada konflik antara bar gelongsor kiri dan kanan dan bar skrol menegak jquery.touchSwipe. Kandungan khusus adalah seperti berikut

Html5 hanya memerlukan fungsi yang boleh ditukar antara kiri dan kanan, tetapi fungsi bar skrol atas dan bawah mesti dikekalkan. Saya menggunakan pemalam jquery.touchSwipe pada terminal mudah alih Selepas mencari dalam talian untuk masa yang lama, saya tidak melihat penyelesaian yang sepadan, saya terpaksa mengubah suainya sendiri, dan akhirnya ia berjaya.

Gambar pertama:

Penyelesaiannya ialah saya menambahkan acara tatal kiri dan kanan pada Badan, dan menggunakan tatal menegak DIV untuk aktiviti atas dan bawah. Kod di atas:

$("#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);  //向右滑动你要执行的动作
  }
Salin selepas log masuk

Kemudian saya menetapkan bar skrol div ke atas dan ke bawah;

<div id="cook" class="cook"></div>
<style>
  .cook{
    overflow: auto;
  }
</style>
Salin selepas log masuk
Tetapkan kod ketinggian lalai badan dan div:


$("body").css("height",document.body.scrollHeight);
$(".cook").css("height",document.body.scrollHeight-$('#cook').position().top);
Salin selepas log masuk
Di atas ialah cara untuk menyelesaikan konflik antara bar skrol gelongsor kiri dan kanan dan saya harap ia akan membantu pembelajaran semua orang.

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan