<p> <strong>Linear</strong><br> <a data-scroll data-options='{ "easing": "linear" }' href="#bazinga">Linear (no other options)</a><br> </p> <p> <strong>Ease-In</strong><br> <a data-scroll data-options='{ "easing": "easeInQuad" }' href="#bazinga">Quad</a><br> <a data-scroll data-options='{ "easing": "easeInCubic" }' href="#bazinga">Cubic</a><br> <a data-scroll data-options='{ "easing": "easeInQuart" }' href="#bazinga">Quart</a><br> <a data-scroll data-options='{ "easing": "easeInQuint" }' href="#bazinga">Quint</a> </p> <p> <strong>Ease-In-Out</strong><br> <a data-scroll data-options='{ "easing": "easeInOutQuad" }' href="#bazinga">Quad</a><br> <a data-scroll data-options='{ "easing": "easeInOutCubic" }' href="#bazinga">Cubic</a><br> <a data-scroll data-options='{ "easing": "easeInOutQuart" }' href="#bazinga">Quart</a><br> <a data-scroll data-options='{ "easing": "easeInOutQuint" }' href="#bazinga">Quint</a> </p> <p> <strong>Ease-Out</strong><br> <a data-scroll data-options='{ "easing": "easeOutQuad" }' href="#bazinga">Quad</a><br> <a data-scroll data-options='{ "easing": "easeOutCubic" }' href="#bazinga">Cubic</a><br> <a data-scroll data-options='{ "easing": "easeOutQuart" }' href="#bazinga">Quart</a><br> <a data-scroll data-options='{ "easing": "easeOutQuint" }' href="#bazinga">Quint</a> </p> <p> .<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br> .<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br> .<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>. </p> <p id="bazinga"><a data-scroll href="#1@#%^-bottom">Bazinga!</a></p> <p> .<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br> .<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br> .<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>. </p> <p id="1@#%^-bottom"><a data-scroll data-options='{ "easing": "easeOutCubic" }' href="#">Back to the top</a></p>