vue.js-div滾動條隱藏但有滾動效果的實現(xiàn)方法
更新時間：2018年03月03日 10:03:37 作者：missing_IT
下面小編就為大家分享一篇vue.js-div滾動條隱藏但有滾動效果的實現(xiàn)方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
組件被包在一個高度固定的div
mounted () {
var boDiv = document.getElementById(this.id);
if(boDiv == undefined){
return;
}
var isFirefox=navigator.userAgent.indexOf("Firefox")
if(isFirefox>0){
boDiv.addEventListener('DOMMouseScroll', function(event) { //火狐
var evt = window.event || arguments[0]
if (evt.detail <= -3) {
boDiv.scrollTop=boDiv.scrollTop-10
} else if (evt.detail >= 3) {
boDiv.scrollTop=boDiv.scrollTop+10
}
evt.stopPropagation();
evt.preventDefault();
}, false);
}else{
boDiv.addEventListener("mousewheel",function(event) {
var evt = window.event || arguments[0]
evt.returnValue = false //屏蔽body滾動事件
if (evt.wheelDelta <= -120) {
boDiv.scrollTop=boDiv.scrollTop+40
} else if (evt.wheelDelta >= 120) {
boDiv.scrollTop=boDiv.scrollTop-40
}
})
}
}
}
以上這篇vue.js-div滾動條隱藏但有滾動效果的實現(xiàn)方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了vue中選中多個選項并且改變選中的樣式，本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-09-09
HBuilder導(dǎo)入vue項目并通過域名訪問的過程詳解
這篇文章主要介紹了HBuilder導(dǎo)入vue項目并通過域名訪問,一般情況下運行vue項目需要安裝node.js，通過npm命令來安裝vue組件和運行vue項目，本文給大家介紹的非常詳細，需要的朋友可以參考下2022-05-05
這篇文章主要介紹了vue指令防止按鈕連點解析，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04
這篇文章主要為大家詳細介紹一下Vue中$nextTick的作用于原理,這也是面試中常常考到的問題,文中的示例代碼講解詳細,對我們深入了解Vue有一定的幫助,需要的小伙伴可以參考一下2023-10-10
這篇文章主要介紹了vue todo-list組件發(fā)布到npm上的方法,小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-04-04
本篇文章主要介紹了Vue2.0組件間數(shù)據(jù)傳遞示例，組件間數(shù)據(jù)傳遞主要是父子組件之間傳遞，具有一定的參考價值，有興趣的可以了解一下。2017-03-03
這篇文章主要為大家介紹了前端vue架構(gòu)插槽slot使用教程示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-02-02
Vue?設(shè)置圖片不轉(zhuǎn)為base64的方式
這篇文章主要介紹了Vue實現(xiàn)設(shè)置圖片不轉(zhuǎn)為base64的方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-02-02
vue項目接入高德地圖點擊地圖獲取經(jīng)緯度以及省市區(qū)功能
這篇文章主要給大家介紹了關(guān)于vue項目接入高德地圖點擊地圖獲取經(jīng)緯度以及省市區(qū)功能的相關(guān)資料,開發(fā)中我們需要地圖定位,就是用戶輸入位置,自動定位獲取經(jīng)緯度,需要的朋友可以參考下2023-08-08
Token是身份驗證后服務(wù)端返回的令牌,常用于訪問授權(quán)API和頁面權(quán)限校驗,Token數(shù)據(jù)可存儲在本地或Vuex中,本地存儲可實現(xiàn)數(shù)據(jù)持久化,這篇文章主要介紹了vue登錄成功之后的token處理詳細步驟,需要的朋友可以參考下2024-10-10