* Scroll to value with transition * @param {Number} scrollTargetY Scroll value * @param {Number} speed Speed
(scrollTargetY = 0, speed = 2000)
| 42 | * @param {Number} speed Speed |
| 43 | */ |
| 44 | scrollTo(scrollTargetY = 0, speed = 2000) |
| 45 | { |
| 46 | // Set up |
| 47 | const scrollY = window.scrollY || document.documentElement.scrollTop |
| 48 | let currentTime = 0 |
| 49 | const time = Math.max(.1, Math.min(Math.abs(scrollY - scrollTargetY) / speed, .8)) |
| 50 | |
| 51 | // EaseInOutQuint |
| 52 | const easeInOutQuint = (pos) => |
| 53 | { |
| 54 | if ((pos /= 0.5) < 1) { |
| 55 | return 0.5 * Math.pow(pos, 5); |
| 56 | } |
| 57 | return 0.5 * (Math.pow((pos - 2), 5) + 2); |
| 58 | } |
| 59 | |
| 60 | // Tick |
| 61 | const tick = () => |
| 62 | { |
| 63 | currentTime += 1 / 60 |
| 64 | |
| 65 | const p = currentTime / time |
| 66 | const t = easeInOutQuint(p) |
| 67 | |
| 68 | if(p < 1) |
| 69 | { |
| 70 | window.requestAnimationFrame(tick) |
| 71 | window.scrollTo(0, scrollY + ((scrollTargetY - scrollY) * t)) |
| 72 | } |
| 73 | else |
| 74 | { |
| 75 | window.scrollTo(0, scrollTargetY) |
| 76 | } |
| 77 | } |
| 78 | |
| 79 | tick() |
| 80 | } |
| 81 | } |