Heim > Artikel > Web-Frontend > Wie verwende ich die div-Bildlaufleiste, um sie auszublenden, aber einen Bildlaufeffekt in vue.js zu haben?
Im Folgenden werde ich Ihnen eine Implementierungsmethode vorstellen, mit der Sie die Bildlaufleiste von vue.js-p ausblenden, aber einen Bildlaufeffekt erzielen können. Sie hat einen guten Referenzwert und ich hoffe, dass sie für alle hilfreich ist.
Die Komponente ist in eine feste Höhe eingewickelt
mounted () { var bop = document.getElementById(this.id); if(bop == undefined){ return; } var isFirefox=navigator.userAgent.indexOf("Firefox") if(isFirefox>0){ bop.addEventListener('DOMMouseScroll', function(event) { //火狐 var evt = window.event || arguments[0] if (evt.detail <= -3) { bop.scrollTop=bop.scrollTop-10 } else if (evt.detail >= 3) { bop.scrollTop=bop.scrollTop+10 } evt.stopPropagation(); evt.preventDefault(); }, false); }else{ bop.addEventListener("mousewheel",function(event) { var evt = window.event || arguments[0] evt.returnValue = false //屏蔽body滚动事件 if (evt.wheelDelta <= -120) { bop.scrollTop=bop.scrollTop+40 } else if (evt.wheelDelta >= 120) { bop.scrollTop=bop.scrollTop-40 } }) } } }
Das Obige ist was Ich habe „Für alle“ organisiert und hoffe, dass es in Zukunft für alle hilfreich sein wird.
Verwandte Artikel:
js+css, um einen Tippeffekt zu erzielen
tutorial zur Nginx-Bereitstellung des vue.js-Projekts
Eine kurze Einführung in die Verwendung der React-Redux-Middleware
Das obige ist der detaillierte Inhalt vonWie verwende ich die div-Bildlaufleiste, um sie auszublenden, aber einen Bildlaufeffekt in vue.js zu haben?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!