Saya mendapat sesuatu hari ini. Halaman ini awalnya horizontal, jadi ada bilah gulir horizontal di bagian bawah, dan tidak ada batang gulir secara vertikal. Sekarang diperlukan bahwa katrol mouse harus menggulir kiri dan kanan, yang membutuhkan penulisan kode JS untuk mengimplementasikannya. Saya mengalami banyak masalah dalam menulis proses ini.
Fungsi yang didukung oleh tiga browser IE Firefox Chrome benar -benar berbeda, itu gila.
Berikut adalah beberapa poin pengetahuan untuk dijelaskan
Pantau acara katrol
IE: Onmousewheel
Firfox: Dommousescroll
Chrome: Mousewheel
Sayangnya, terdiam
Nilai pengembalian gulir juga berbeda
Firfox kembali +-3 dengan detail
Yang lain menggunakan wheeldelta untuk kembali +-120
Ada nilai pengembalian untuk menentukan arah pengguliran
Selain Page Judgment Halaman Gerakan Kiri, Document.DocumentElement.scrollleft digunakan untuk browser umum.
Namun, browser chrome perlu menggunakan document.body.scrollleft
Oke, kode dibagikan sebagai berikut:
<! Doctype html public "-// w3c // dtd xhtml 1.0 transisi // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Unt titled document</title></head> <body><div id="test"></div><script language="javascript"> var dbody = document.geteLementById ('test'); // ff menggunakan objaddevent (document, 'dommousscroll', function (e) {return mouse_scroll (e);}) // tidak ada ff chrome gunakan objaddevent (document, 'mousewheel', function (e) {return mouse mouse_scroL (document, 'mousewheel', function (e) {return mouse mouse_scroL (document, 'mouseWheel', function (e) {return mouse mouse_scrole (document, 'mousewheel', function (e) {return mouse mouse_scrole (document, 'mousewheel', function (e) {return mouse mouse mouse_scrol Objaddevent (dbody, 'mousewheel', function (e) {return mouse_scroll (e);}) function mouse_scroll (e) {e = e || window.event; var deld = e.wheeldelta? e.wheeldelta: -e.detail*40; // menilai arah naik dan turun var move_s = deld> 0? -50: 50; document.documentelement.scrollleft+= move_s; // Gunakan ini untuk browser non-chrome // Gunakan ini untuk browser chrome if (document.documentelement.scrollleft == 0) document.body.scrollleft+= move_s; return false;}//This is a function that adds monitoring methods to the object function objAddEvent(oEle, sEventName, fnHandler){if(oEle.attachEvent) oEle.attachEvent('on'+sEventName, fnHandler);else oEle.addEventListener(sEventName, fnHandler, false);} </script> </body> </html>Bahkan, ada masalah dengan kode ini. Di browser Chrome, hanya mouse yang dapat meluncur dengan warna abu -abu itu. Saya belum menyelesaikan masalah ini. Jika ahli itu menyelesaikannya, Anda dapat meninggalkan pesan untuk memberi tahu saya, terima kasih.