FuckMyScroll - sample

FuckMyScroll - sample.markdown

FuckMyScroll - sample

A Pen by Gabriel Jacinto on CodePen.

License.

index.html

<nav id="nav">
  Go to
  <a href="#cat" fmscroll>Cat</a>
  <a href="#dog" fmscroll>Dog</a>
  <a href="#horse" fmscroll>Horse</a>
</nav>
  
<div id="cat">
  <img src="http://afv.com/wp-content/uploads/2014/12/confused-kitty.jpg" alt="cat image" width="400">
</div>
  
<div id="horse">
  <img src="https://i.ytimg.com/vi/qrfcTxLP7lw/maxresdefault.jpg" alt="horse image" width="400">
</div>
  
<div id="dog">
    <img src="http://stuffpoint.com/dogs/image/307235-dogs-cute-dog.jpg" alt="dog image" width="400">
</div>

<div id="to-top">
  <a href="#nav" fmscroll><h3>Back to top</h3></a>
</div>

script.js

window.onload = function () {  
  const fms = new FuckMyScroll({
    speed: 10,
    init: function (target) {
      console.log('Going to #' + target);
    },
    end: function (target) {
      console.log('Here we are!');
    }
  });

  fms.init();
};

scripts

<script src="https://cdn.rawgit.com/gabrieljmj/fuckmyscroll/master/dist/fuckmyscroll.js"></script>

style.css

#cat {
  margin-top: 500px;
}
    
#dog {
  margin-top: 2000px;
}
    
#horse {
  margin-left: 2000px;
}

#cat, #dog, #horse {
  float: left;
}

#to-top {
  position: fixed;
  bottom: 0;
}