happy-sticky
v1.0.4
Published
easy to write a sticky element
Downloads
1
Readme
happy sticky 通过 js 快速实现粘性定位,高度自动计算
主要函数列表
addStickyToEleByClass
添加 stickey 属性到目标元素
| 参数 | 类型 | 默认值 | 描述 | 是否必填 | | --------------- | ------ | ------ | -------- | -------- | | className | string | -- | 操作元素 | 是 | | targetClassName | string | -- | 目标元素 | 是 | | radio | number | 0 | 偏差 | 否 |
addStickyToEleById
添加 stickey 属性到目标元素
| 参数 | 类型 | 默认值 | 描述 | 是否必填 | | -------- | ------ | ------ | -------- | -------- | | id | string | -- | 操作元素 | 是 | | targetId | string | -- | 目标元素 | 是 | | radio | number | 0 | 偏差 | 否 |
linstenScroll
监听滚动返回当前是否处于 sticky 状态
| 参数 | 类型 | 默认值 | 描述 | 是否必填 | | --------------- | -------- | ------ | ------------------------- | ---------------------- | | className | string | -- | 操作元素 | 是 | | targetClassName | string | -- | 目标元素 | 是 | | callback | function | -- | 回调函数,返回 true/false | isRemove 为 false 必填 | | isRemove | boolean | 0 | 是否移除监听 | 否 |
scrollToStickyByHeight
按照给定高度滚动到指定位置
| 参数 | 类型 | 默认值 | 描述 | 是否必填 | | ------ | ------ | ------ | ------ | -------- | | ctx | this | -- | 上下文 | 是 | | height | number | 0 | 高度 | 是 |
scrollToStickyById
滚动到 targetClassName
| 参数 | 类型 | 默认值 | 描述 | 是否必填 | | --------------- | ------ | ------ | -------- | -------- | | ctx | this | -- | 上下文 | 是 | | className | string | -- | 操作元素 | 是 | | targetClassName | string | -- | 目标元素 | 是 | | radio | number | 0 | 高度 | 否 |
创建粘性定位元素
| 参数 | 类型 | 默认值 | 描述 | 是否必填 | | ----------------- | ------------------------------------- | ------ | ------------------ | -------- | | tagType | K extends keyof HTMLElementTagNameMap | div | 标签类型 | 否 | | direction | 'top'、'bottom'、 'left'、 'right' | top | 吸附方向 | 否 | | distance | number | 0 | 吸附高度 | 否 | | fatherContainerId | string | null | 添加到目标元素内部 | 否 | | className | string | null | 类名 | 否 |
createStickyBeforeEle
创建粘性定位元素
| 参数 | 类型 | 默认值 | 描述 | 是否必填 | | ----------------- | ------------------------------------- | ------ | ------------------ | -------- | | tagType | K extends keyof HTMLElementTagNameMap | div | 标签类型 | 否 | | direction | 'top'、'bottom'、 'left'、 'right' | top | 吸附方向 | 否 | | distance | number | 0 | 吸附高度 | 否 | | fatherContainerId | string | null | 添加到目标元素内部 | 否 | | targetId | string | null | 添加到目标元素前 | 否 | | className | string | null | 类名 | 否 |
getStickyTopById
获取相对于某元素吸附的高度
| 参数 | 类型 | 默认值 | 描述 | 是否必填 | | ---- | ------ | ------ | ----------- | -------- | | id | string | 必填 | 目标元素 id | 是 |
getStickyTopByClassName
获取相对于某元素吸附的高度
| 参数 | 类型 | 默认值 | 描述 | 是否必填 | | ----- | ------ | ------ | -------------- | -------- | | class | string | 必填 | 目标元素 class | 是 |
createWrapper
创建容器
| 参数 | 类型 | 默认值 | 描述 | 是否必填 | | ----------------- | ------------------------------------- | ------ | -------------- | -------- | | tagType | K extends keyof HTMLElementTagNameMap | div | 目标元素 class | 否 | | className | string | null | 目标元素 class | 否 | | fatherContainerId | string | body | 目标元素 class | 否 |