ScrollDir 介绍
ScrollDir 是 Scroll Direction 的缩写，它是 一个 0 依赖，并且大小 ?1kb 的微型 JavaScript 插件 。它通过数据 属性 轻松利用 css 来控制垂直滚动。可用作向下滚动隐藏，向上滚动 显示 的粘性导航 菜单 。
ScrollDir 的 效果 就像粘性导航 菜单 ，当你向下 滚动页面 的时候，导航 菜单 隐藏，向上 滚动页面 的时候，导航 菜单 显示 。
特色：根据滚动方向 显示 或隐藏粘性元素
在滚动的时候只改变其方向 属性
忽略导致不必要的元素抖动的滚动动作
用法
ScrolScrollDir 会将 <html> 元素上的 data-scrolldir 属性 设置为 up 或 down ：
<html data-scrolldir="up">
或者
<html data-scrolldir="down">
然后根据 用户 滚动的方向更改样式：
[data-scrolldir="down"] .my-fixed-header { dis play: none; }
设置
简单模式只需要在你的 html 文档中 添加 scrolldir.auto.min.js 文件 。
然后使用 [data-scrolldir="down"] 和 [data-scrolldir="up"] 写一些 css 样式。
定制模式添加 scrolldir.min.js 。你可以访问下面的 API 选项，并且必须 调用 scrollDir 。
scrollDir();
使用使用 data-scrolldir 以外的 属性 ：
scrollDir({ attribute: 'new-attribute-name' });
将 Scrolldir 属性 添加 到不同的元素中：
scrollDir({ el: 'your-new-selector' });
关闭 Scrolldir ：
scrollDir({ off: true });
在 页面 加载（或应用程序启动）时，提供不同的滚动方向：
scrollDir({ direction: 'up' }); // 默 认为向下滚动
网站地址 : https://dollarshaveclub.github.io/scrolldir/
GitHub: https://github.com/dollarshaveclub/scrolldir
网站描述: 利用 CSS 来控制垂直滚动的 JavaScript 插件
ScrollDir官方网站
官方网站： https://dollarshaveclub.github.io/scrolldir/
如果觉得 网站内容还不错，欢迎将 网站 推荐给程序员好友。