Skip to content

Instantly share code, notes, and snippets.

@serweb-labs
Last active February 7, 2018 17:14

Revisions

  1. serweb-labs revised this gist Feb 7, 2018. 1 changed file with 7 additions and 0 deletions.
    7 changes: 7 additions & 0 deletions app.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,7 @@
    // for jquery

    $( document ).ready(function() {
    $(".smoothScroll").on('click', function(e){
    smoothScroll(e);
    })
    });
  2. serweb-labs revised this gist Feb 7, 2018. 1 changed file with 6 additions and 11 deletions.
    17 changes: 6 additions & 11 deletions smoothScroll.js
    Original file line number Diff line number Diff line change
    @@ -1,6 +1,7 @@
    function jump(target, options) {
    console.log("sdasddsa");
    window.jump = function(target, options) {
    options = options || {};
    var t = document.querySelector(target);
    if (t == null) return;
    var start = window.pageYOffset,
    opt = {
    duration: options.duration || 100,
    @@ -9,7 +10,7 @@ function jump(target, options) {
    easing: options.easing || easeInOutQuad
    },
    distance = typeof target === 'string'
    ? opt.offset + document.querySelector(target).getBoundingClientRect().top
    ? opt.offset + t.getBoundingClientRect().top
    : target,
    duration = typeof opt.duration === 'function'
    ? opt.duration(distance)
    @@ -31,9 +32,7 @@ function jump(target, options) {
    }

    function end() {
    console.log( start + distance)
    window.scrollTo(0, start + distance);

    if (typeof opt.callback === 'function')
    opt.callback();
    }
    @@ -47,20 +46,16 @@ function jump(target, options) {
    }
    }

    function smoothScroll(e, offset) {
    window.smoothScroll = function (e, offset) {
    e.stopPropagation();
    e.preventDefault();
    offset = offset || -50;
    var vm = this;
    var hash = e.target.hash || e.currentTarget.hash
    vm.working = true;

    jump(hash, {
    duration: 400,
    offset: offset,
    callback: function() {
    vm.step = vm.index[e.target.hash];
    vm.working = false;
    }
    callback: function() {}
    });
    }
  3. serweb-labs created this gist Feb 5, 2018.
    66 changes: 66 additions & 0 deletions smoothScroll.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,66 @@
    function jump(target, options) {
    console.log("sdasddsa");
    options = options || {};
    var start = window.pageYOffset,
    opt = {
    duration: options.duration || 100,
    offset: options.offset || 0,
    callback: options.callback,
    easing: options.easing || easeInOutQuad
    },
    distance = typeof target === 'string'
    ? opt.offset + document.querySelector(target).getBoundingClientRect().top
    : target,
    duration = typeof opt.duration === 'function'
    ? opt.duration(distance)
    : opt.duration,
    timeStart, timeElapsed
    ;

    requestAnimationFrame(function(time) { timeStart = time; loop(time); });

    function loop(time) {
    timeElapsed = time - timeStart;

    window.scrollTo(0, opt.easing(timeElapsed, start, distance, duration));

    if (timeElapsed < duration)
    requestAnimationFrame(loop)
    else
    end();
    }

    function end() {
    console.log( start + distance)
    window.scrollTo(0, start + distance);

    if (typeof opt.callback === 'function')
    opt.callback();
    }

    // Robert Penner's easeInOutQuad - http://robertpenner.com/easing/
    function easeInOutQuad(t, b, c, d) {
    t /= d / 2
    if(t < 1) return c / 2 * t * t + b
    t--
    return -c / 2 * (t * (t - 2) - 1) + b
    }
    }

    function smoothScroll(e, offset) {
    e.stopPropagation();
    e.preventDefault();
    offset = offset || -50;
    var vm = this;
    var hash = e.target.hash || e.currentTarget.hash
    vm.working = true;

    jump(hash, {
    duration: 400,
    offset: offset,
    callback: function() {
    vm.step = vm.index[e.target.hash];
    vm.working = false;
    }
    });
    }