javascript - Mengapa acara tatal tidak boleh menghalang menggelegak?
PHP中文网
PHP中文网 2017-07-05 11:07:59
0
6
4129

Keperluan ialah apabila tetikus berada di dalam elemen dengan bar skrol pada halaman, acara skrol dicetuskan untuk menghalang skrol badan daripada dicetuskan pada masa yang sama.

Secara terang-terangan: apabila tetikus bergolek di dalam p, walaupun p bergolek ke hujung, badan tidak akan menatal.


Saya memberi p acara skrol untuk mengelakkan menggelegak. Saya mahu menggunakan idea ini untuk melumpuhkan skrol badan, tetapi ia tidak berguna.
Maka timbul persoalan:
1. Bagaimana untuk merealisasikan keperluan ini?
2. Mengapa tatal tidak boleh mengelak menggelegak?
3 Saya sudah tahu tentang kaedah pemberian badan inioverflow:hidden. Jika anda menggunakan kaedah ini, masalahnya ialah untuk menentukan sama ada kedudukan tetikus berada dalam p Terdapat banyak isu keserasian, dan nampaknya anda mesti mencetuskan pemerolehan kedudukan melalui latihan (seperti mousemove, saya tidak). t tahu jika terdapat penyelesaian yang lebih mudah atau beberapa penambahbaikan?


27 Mei

Terima kasih semua kerana membawa demo! ! !
Kaedah yang saya temui dalam talian juga menggunakan scrollTop, tetapi saya tidak pernah menemui kaedah yang lebih praktikal, dan semuanya ditulis dengan sangat rumit.
Terima kasih kepadacc_christiankerana menyediakan versi yang sangat jelas dan praktikal ini~cc_christian提供这个非常清晰实用的版本~
当然,浴巾Sudah tentu, plug-in jq yang disediakan oleh

lebih berkuasa dan boleh dikatakan sempurna~


Nampaknya keserasian masalah skrol ini memang tidak begitu baik.
Dan saya jumpa masalah sebenarnya, saya dah jumpa banyak idea scrollTop di Internet sebelum ini, tetapi saya masih keliru, kenapa acara sendiri tidak boleh dihentikan? Terutamanya roda tetikus, tatal mengatakan pada MDN bahawa ia tidak boleh membatalkan menggelegak, tetapi roda tetikus mengatakan ia boleh, tetapi ia masih tidak berfungsi dalam penggunaan sebenar.
Satu-satunya cara ialah menyimpan kedudukan tatal dan tetapkan nilai kepada tatal Atas apabila tuding menatal ke atas.浴巾Dianggarkan
mempunyai prinsip yang sama di dalam pemalam (saya sebenarnya tidak melihatnya, saya takut saya mungkin tidak dapat memahami semuanya pada masa ini)

Tetapi mengapa roda tetikus tidak boleh melakukannya ? Mengapa ia tidak boleh berhenti menggelegak? Sekarang keperluan itu telah dilaksanakan dengan sempurna, saya hanya ingin mengetahui lebih lanjut tentang prinsip di sebalik acara asal.
PHP中文网
PHP中文网

认证高级PHP讲师

membalas semua (6)
给我你的怀抱
  1. pemalam jQuery: http://mohammadyounes.github....

  2. Isu prestasi
    Apabila roda menatal satu bingkai, acara tatal hanya dicetuskan sekali
    Acara tatal dicetuskan secara berterusan Sejak tatal lancar diperkenalkan (sebenarnya, IE6 sudah mempunyai tatal lancar), setiap kali roda tatal ditatal. 1 piksel, acara tatal akan dicetuskan

  3. Adalah tidak disyorkan untuk bertukar berulang kali antaraoverflow:hiddenoverflow:hiddenkerana ia akan menyebabkan isu susun atur semula dan prestasi


Prinsip:
Acara tatal tidak boleh menghentikanPropagation mahupun preventDefault
Nampaknya ia menghalang acara tatal, tetapi ia sebenarnya adalah acara preventDefault roda/butang

Selain itu, roda tetikus mempunyai masalah keserasian, jadi semua orang menggunakan jQuery

    我想大声告诉你

    Saya lupa di mana saya membaca artikel berkaitan
    Ambil Demo

      小葫芦

      Ajar anda resipi, tetapkan pembolehubah isScrolling = palsu

      Apabila tetikus melayang ke sasaran p, isScrolling = benar; dan untuk badan, apabila isScrolling = benar, perkara mudah adalah

      document.onmousewheel = function(e){ e = e || event; if(isScrolling){ e.preventDefault(); return false; } };

      Dan apabila tetikus bergerak menjauhi p, isScrolling = false.

        扔个三星炸死你

        demo menyekat tatal

        //阻止事件冒泡 $.stopEvent = function (e) { if (e && e.stopPropagation) { e.stopPropagation() } else { window.event.cancelBubble = true } }; //阻止浏览器默认行为 $.stopDefault = function (e) { if (e && e.preventDefault) { e.preventDefault() } else { window.event.returnValue = false } };
          学霸

          Baiklah, tiada siapa yang meneruskan.

          Kaedah yang ada pada masa ini masih tersembunyi.

          Mengenai mengapa tatal tidak boleh menghalang menggelegak, saya menemui jawapan di MDN: ia mengatakan bahawa tatal hanya gelembung ke document.defaultView dan tidak boleh dibatalkan.

          Tapi mdn cakap mousewheel boleh elakkan menggelegak, tapi dah cuba tak berjaya harap student yang tahu guna boleh buat demo untuk tengok~

            世界只因有你

            Cuba acara roda tetikus

              Muat turun terkini
              Lagi>
              kesan web
              Kod sumber laman web
              Bahan laman web
              Templat hujung hadapan
              Tentang kita Penafian Sitemap
              Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!