Skip to content

Commit

Permalink
fix lenis-scrolling css class
Browse files Browse the repository at this point in the history
  • Loading branch information
clementroche committed Nov 25, 2024
1 parent 81fcba1 commit e426e66
Show file tree
Hide file tree
Showing 4 changed files with 31 additions and 7 deletions.
15 changes: 9 additions & 6 deletions packages/core/src/lenis.ts
Original file line number Diff line number Diff line change
Expand Up @@ -415,7 +415,11 @@ export class Lenis {
this.direction = Math.sign(
this.animatedScroll - lastScroll
) as Lenis['direction']
this.isScrolling = 'native'

if (!this.isStopped) {
this.isScrolling = 'native'
}

this.emit()

if (this.velocity !== 0) {
Expand All @@ -442,20 +446,19 @@ export class Lenis {
*/
start() {
if (!this.isStopped) return
this.isStopped = false

this.reset()

this.isStopped = false
}

/**
* Stop lenis scroll
*/
stop() {
if (this.isStopped) return
this.isStopped = true
this.animate.stop()

this.reset()

this.isStopped = true
}

/**
Expand Down
5 changes: 5 additions & 0 deletions playground/core/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -19,3 +19,8 @@
width: 100vw;
} */
}

#debug {
position: sticky;
top: 4rem;
}
12 changes: 12 additions & 0 deletions playground/core/test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -96,3 +96,15 @@ document.documentElement.addEventListener('wheel', (e) => {
// }

// requestAnimationFrame(raf)

const stopButton = document.getElementById('stop')
const startButton = document.getElementById('start')

stopButton?.addEventListener('click', () => {
lenis.stop()
console.log('stop')
})

startButton?.addEventListener('click', () => {
lenis.start()
})
6 changes: 5 additions & 1 deletion playground/www/pages/core.astro
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,11 @@ import '~/core/style.css'
import Layout from '../layouts/Layout.astro'
---
<Layout title="Lenis">
<button id="scroll-100">Scroll 100</button>
<div id="debug">
<button id="scroll-100">Scroll 100</button>
<button id="stop">Stop</button>
<button id="start">Start</button>
</div>
<div id="app">
<div id="nested">
<div id="nested-content"></div>
Expand Down

0 comments on commit e426e66

Please sign in to comment.