Skip to content

Instantly share code, notes, and snippets.

@simonrw

simonrw/scrollsave.html

Created December 27, 2017 23:02
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save simonrw/679c1e4a308fd8c61b1e4f562eb3f2b8 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save simonrw/679c1e4a308fd8c61b1e4f562eb3f2b8 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. simonrw created this gist Dec 27, 2017.
    47 changes: 47 additions & 0 deletions scrollsave.html
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,47 @@
    <!doctype html>
    <html>
    <head>
    <meta charset="utf8">
    <style>
    div#main {
    border: 1px solid black;
    display: inline-block;
    width: 1024px;
    max-width: 1024px;
    height: 1024px;
    max-height: 1024px;
    }
    </style>
    </head>
    <body>
    <div id="main"></div>
    <script type="text/javascript">
    class ScrollPoster {
    constructor(url) {
    this.url = url;
    this.isScrolling = null;
    this.init();
    }

    post(location, position) {
    console.log('Posting: ', { href: location.href, pos: position });
    }

    init() {
    var self = this;
    window.addEventListener('scroll', function(e) {
    window.clearTimeout(this.isScrolling);
    this.isScrolling = setTimeout(function() {
    const pos = window.scrollY;
    self.post(window.location, pos);
    }, 333);
    }, false);
    }
    };

    window.onload = () => {
    const handler = new ScrollPoster('http://example.com');
    };
    </script>
    </body>
    </html>