Skip to content

Commit b6eb1bf

Browse files
phucbmphucbm
committed
♻️ release v2.0.0
1 parent b85f8a6 commit b6eb1bf

File tree

3 files changed

+45
-17
lines changed

3 files changed

+45
-17
lines changed

‎README.md‎

Lines changed: 39 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
</div>
66

77
<div align="center">
8-
<a href="https://jekyllrb.com/">
9-
<img src="https://img.shields.io/badge/Stable-v1.1.0-0088ff">
8+
<a href="https://github.com/phucbm/https://badgen.net/github/release/phucbm/jquery-scroll-direction-plugin/?cache=600/releases/latest">
9+
<img src="https://badgen.net/github/release/phucbm/jquery-scroll-direction-plugin/?cache=600/?cache=600">
1010
</a>
1111
<a href="https://www.jsdelivr.com/package/gh/phucbm/jquery-scroll-direction-plugin">
1212
<img src="https://data.jsdelivr.com/v1/package/gh/phucbm/jquery-scroll-direction-plugin/badge">
@@ -21,15 +21,19 @@
2121

2222
### Download locally
2323

24-
You can [download the plugin directly from Github](https://raw.githubusercontent.com/phucbm/jquery-scroll-direction-plugin/main/jquery.scroll-direction.js).
24+
You
25+
can [download the plugin directly from Github](https://raw.githubusercontent.com/phucbm/jquery-scroll-direction-plugin/main/jquery.scroll-direction.js)
26+
.
2527

2628
```html
29+
2730
<script src="your-path/jquery.scroll-direction.js"></script>
2831
```
2932

3033
### Using CDN
3134

32-
You can also browse for the latest version by visiting [Scroll Direction on jsDelivr](https://cdn.jsdelivr.net/gh/phucbm/jquery-scroll-direction-plugin/)
35+
You can also browse for the latest version by
36+
visiting [Scroll Direction on jsDelivr](https://cdn.jsdelivr.net/gh/phucbm/jquery-scroll-direction-plugin/)
3337

3438
```html
3539
<!-- Scroll Direction - v1.1.0 -->
@@ -53,6 +57,7 @@ $.scrollDirection.init();
5357
```
5458

5559
```html
60+
5661
<body class="scroll-top scroll-up"></body>
5762
```
5863

@@ -70,7 +75,7 @@ $.scrollDirection.init({
7075
});
7176

7277
// update Scroll Direction on Locomotive scroll event
73-
scroller.on('scroll', function (obj) {
78+
scroller.on('scroll', function(obj){
7479
$.scrollDirection.update({
7580
scrollAmount: () => obj.scroll.y,
7681
maxScrollAmount: () => obj.limit.y,
@@ -108,34 +113,50 @@ $.scrollDirection.init({
108113
### Update
109114

110115
```js
116+
// jQuery
111117
$.scrollDirection.update({
112118
// update new options
113119
});
120+
121+
// Pure JS
122+
window.scrollDirection.update({
123+
// update new options
124+
});
114125
```
115126

116127
### Events
117128

118129
```js
130+
// jQuery
119131
// this event runs whenever you load, resize and scroll
120-
$(window).on("scrollDirection", function () {
121-
// do your job here
132+
$(window).on("scrollDirection", function(){
133+
// do your job here
122134
});
123135

124136
// when you scroll up
125-
$(window).on("scrollUp", function () {});
137+
$(window).on("scrollUp", function(){
138+
});
126139

127140
// when you scroll down
128-
$(window).on("scrollDown", function () {});
141+
$(window).on("scrollDown", function(){
142+
});
129143

130144
// when you at the beginning of the page, you can increase the top zone using topOffset
131-
$(window).on("scrollAtTop", function () {});
145+
$(window).on("scrollAtTop", function(){
146+
});
132147

133148
// when you in the middle of the page
134149
// this means the top and bottom zone are not visible in view port
135-
$(window).on("scrollAtMiddle", function () {});
150+
$(window).on("scrollAtMiddle", function(){
151+
});
136152

137153
// when you touch the end of the page
138-
$(window).on("scrollAtBottom", function () {});
154+
$(window).on("scrollAtBottom", function(){
155+
});
156+
157+
// Pure JS
158+
document.addEventListener("scrollDirection", () => {
159+
});
139160
```
140161

141162
### APIs
@@ -149,9 +170,15 @@ You can also check the current scroll direction/position using these provided AP
149170
- `$.scrollDirection.isScrollAtBottom`
150171

151172
```js
173+
// jQuery
152174
if($.scrollDirection.isScrollUp){
153175
// do something
154176
}
177+
178+
// Pure JS
179+
if(window.scrollDirection.isScrollUp){
180+
// do something
181+
}
155182
```
156183

157184
## Deployment

‎index.html‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,8 @@
33
<head>
44
<meta charset="UTF-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6-
<title>Title</title>
6+
<link rel="icon" type="image/png" href="logo.svg"/>
7+
<title>Scroll Direction</title>
78

89
<style>
910
* {box-sizing:border-box;}
@@ -50,7 +51,7 @@
5051
<body>
5152

5253
<header>
53-
<h1>jQuery Scroll Direction Plugin</h1>
54+
<h1>Scroll Direction</h1>
5455
<div><a href="https://github.com/phucbm/jquery-scroll-direction-plugin" target="_blank">https://github.com/phucbm/jquery-scroll-direction-plugin</a>
5556
</div>
5657
</header>
@@ -130,7 +131,7 @@ <h1>jQuery Scroll Direction Plugin</h1>
130131
</div>
131132

132133
<footer>
133-
<div>MIT License | Copyright (c) 2020 Minh-Phuc Bui</div>
134+
<div>MIT License | Copyright (c) 2022 Minh-Phuc Bui</div>
134135
</footer>
135136
<div id="log"></div>
136137

‎jquery.scroll-direction.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
/**
2-
* jQuery Scroll Direction Plugin 1.1.0
2+
* jQuery Scroll Direction Plugin 2.0.0
33
* https://github.com/phucbm/jquery-scroll-direction-plugin
44
*
55
* Released under the MIT license
6-
* Date: 2021-06-20
6+
* Date: 2022-02-08
77
*/
88

99
(function($){

0 commit comments

Comments
 (0)