-
-
Save dav11d/1cc7a3351010e079f17319c2eb6d8fec to your computer and use it in GitHub Desktop.
| function SmoothScroll(target, speed, smooth) { | |
| if (target == document) | |
| target = (document.documentElement || document.body.parentNode || document.body) // cross browser support for document scrolling | |
| var moving = false | |
| var pos = target.scrollTop | |
| target.addEventListener('mousewheel', scrolled, false) | |
| target.addEventListener('DOMMouseScroll', scrolled, false) | |
| function scrolled(e) { | |
| e.preventDefault(); // disable default scrolling | |
| var delta = e.delta || e.wheelDelta; | |
| if (delta === undefined) { | |
| //we are on firefox | |
| delta = -e.detail; | |
| } | |
| delta = Math.max(-1, Math.min(1, delta)) // cap the delta to [-1,1] for cross browser consistency | |
| pos += -delta * speed | |
| pos = Math.max(0, Math.min(pos, target.scrollHeight - target.clientHeight)) // limit scrolling | |
| if (!moving) update() | |
| } | |
| function update() { | |
| moving = true | |
| var delta = (pos - target.scrollTop) / smooth | |
| target.scrollTop += delta | |
| if (Math.abs(delta) > 0.5) | |
| requestFrame(update) | |
| else | |
| moving = false | |
| } | |
| var requestFrame = function() { // requestAnimationFrame cross browser | |
| return ( | |
| window.requestAnimationFrame || | |
| window.webkitRequestAnimationFrame || | |
| window.mozRequestAnimationFrame || | |
| window.oRequestAnimationFrame || | |
| window.msRequestAnimationFrame || | |
| function(func) { | |
| window.setTimeout(func, 1000 / 50); | |
| } | |
| ); | |
| }() | |
| } | |
| // call it | |
| new SmoothScroll(document, 120, 12) |
Hi, thanks for this great plugin, Im having some problems with anchor scroll smooth, when i click on link anchor and scroll the page brings back to top. I tried many ways to fix this but without success, can you help me?
this is my scroll anchor plugin:
var links = document.getElementsByClassName('scroll-link');
for (var k = 0; k < links.length; k++) {
links[k].onclick = scroll;
}
function scroll(e) {
e.preventDefault();
var id = this.getAttribute('href').replace('#', '');
var target = document.getElementById(id).getBoundingClientRect().top;
animateScroll(target);
if(document.querySelector('.sandwich-trigger').classList.contains('sandwich-open') == true) {
document.querySelector('.menu ul').classList.remove('nav-open');
document.querySelector('.sandwich-trigger').classList.remove('sandwich-open');
}
}
function animateScroll(targetHeight) {
targetHeight = document.body.scrollHeight - window.innerHeight > targetHeight + scrollY ?
targetHeight : document.body.scrollHeight - window.innerHeight;
var initialPosition = window.scrollY;
var SCROLL_DURATION = 40;
var step_x = Math.PI / SCROLL_DURATION;
var step_count = 0;
requestFrame(step);
function step() {
if (step_count < SCROLL_DURATION) {
requestAnimationFrame(step);
step_count++;
window.scrollTo(0, initialPosition + (targetHeight - 70) * 0.25 * Math.pow((1 - Math.cos(step_x * step_count)), 2));
new WSmoothScroll(document.body,120,12, targetHeight, initialPosition, step_x, step_count);
}
}
}
Hi, scoroll does not work in Edge :(