插件资源库

美化元素滚动条:https://github.com/malihu/malihu-custom-scrollbar-plugin

vue项目:

 安装依赖文件:

npm install imports-loader
npm install jquery-mousewheel
npm install malihu-custom-scrollbar-plugin

webpack.base.config.js 文件
module.exports = { module: { loaders: [ { test: /jquery-mousewheel/, loader: "imports?define=>false&this=>window" }, { test: /malihu-custom-scrollbar-plugin/, loader: "imports?define=>false&this=>window" } ] } };

package.json文件添加:
  "jquery": "^3.1.1",
     "jquery-mousewheel": "^3.1.13",
     "malihu-custom-scrollbar-plugin": "^3.1.5"
Scroll.vue文件: 
<template>
    
</template>
<script>
import Vue from 'vue'
import $ from 'jquery'
import 'jquery-mousewheel'
import 'malihu-custom-scrollbar-plugin'
import '../assets/css/jquery.mCustomScrollbar.css'

Vue.directive('scroll', {
    bind(el) {
        Vue.nextTick(() => {
            $(el).mCustomScrollbar({
                mouseWheel: true,
                theme: 'dark'
            })
        })
    },
    update(el) {
        $(el).mCustomScrollbar('update')
    }
})

 

 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值