Security News
tea.xyz Spam Plagues npm and RubyGems Package Registries
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
easy-bar
Advanced tools
Readme
[TOC]
js 实现的浏览器自定义 ScrollBar 工具
npm build:构建
npm start:运行开启服务,查看示例 http://localhost:8080/
npm i easy-bar 安装
电脑端:主流浏览器全部兼容;
移动端:除了火狐手机版外都兼容;(有人测出华为手机系统自带的浏览器也不兼容,身边没有华为手机先搁置)
根据开发场景选择对应的版本.js|.min.js|.common.js|.umd.js
引入
<script src="./easy-bar.min.js"></script>
<div id="el1" style="width:500px; height:500px;">
<div style="width:600px; height:600px;"></div>
</div>
写法一
var el = document.getElementById("el1");
//构建bar
EasyBar.bind(el, options);
//修改bar
EasyBar.update(el, options);
//刷新bar状态 --必要时才用
EasyBar.refreshBar(el);
//解绑
EasyBar.unBind(el);
写法二
var el = document.getElementById("el1");
//构建bar
var bar = new EasyBar(el);
//构建bar
bar.bind(options);
//修改bar
bar.update(options);
//刷新bar状态 --必要时才用
bar.refreshBar();
//解绑
bar.unBind();
引入
import EasyBar from "easy-bar";
Vue.use(EasyBar);
使用
<div style="width:500px; height:500px;" v-bar>
<div style="width:600px; height:600px;"></div>
</div>
请自行封装
minLength: 50,//thumb 的最小长度 ------------ 已去除,改用 css min-height 或 min-width 实现
maxLength: -1,//thumb 的最大长度 ------------ 已去除,改用 css max-height 或 max-width 实现
resizeRefresh: true,//是否监听窗口大小变化
barfloat: true,//滚动条是否浮动
preventParentScroll: false,//是否拦截外部滚动
scrollBarBehavior: null, //bar 行为 如:"show" "show none" 取值:show|hide|none
scrollThrottle: 10,//滚动监听节流周期
draggerThrottle: 10,//拖动监听节流周期
observerThrottle: 200,//子布局变化监听节流周期
resizeDebounce: 200,//窗口大小变化监听去抖周期
scrollingPhantomDelay: 1000,//滑动样式停留时间
draggingPhantomDelay: 1000,//拖动样式停留时间
//下面是个个类名的设置
clsBox: "eb",
clsBoxScrolling: "eb-scrolling",
clsBoxScrollingPhantom: "eb-scrolling-phantom",
clsBoxDragging: "eb-dragging",
clsBoxDraggingPhantomClass: "eb-dragging-phantom",
clsBoxVisibleBarV: "eb-visible-v",
clsBoxInvisibleBarV: "eb-invisible-v",
clsBoxVisibleBarH: "eb-visible-h",
clsBoxInvisibleBarH: "eb-invisible-h",
clsBoxClip: "eb-clip",
clsContent: "eb-content",
clsBarV: "eb-bar-v",
clsBarH: "eb-bar-h",
clsTrack: "eb-track",
clsThumb: "eb-thumb"
FAQs
通用自定义scrollbar
The npm package easy-bar receives a total of 4 weekly downloads. As such, easy-bar popularity was classified as not popular.
We found that easy-bar demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.