Streaming live at 10am (PST)

SmoothScroll.js

Hi!

I know nothing to JS and am trying to implement this custom code to my website: https://github.com/gblazex/smoothscroll-for-websites/wiki

Looks like everything should simply go into the HEAD tag but for some reason it still doesn’t work:

<script>
window.SmoothScrollOptions = {
    // Scrolling Core
    animationTime    : 2000, // [ms]
    stepSize         : 500, // [px]

    // Acceleration
    accelerationDelta : 100,  // 50
    accelerationMax   : 6,   // 3

    // Keyboard Settings
    keyboardSupport   : true,  // option
    arrowScroll       : 50,    // [px]

    // Pulse (less tweakable)
    // ratio of "tail" to "acceleration"
    pulseAlgorithm   : true,
    pulseScale       : 5,
    pulseNormalize   : 2,

    // Other
    touchpadSupport   : false, // ignore touchpad by default
    fixedBackground   : true, 
    excluded          : ''    
}
</script>
<script async src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.9/SmoothScroll.js"></script>

Could someone kindly tell me what I’m doing wrong?

Thanks!

Share link: https://preview.webflow.com/preview/themusicdepartment?utm_source=themusicdepartment&preview=b7029016452eb485925557dbe32823a1

Hi @Pierre-Etienne_Pouli,

  1. Scripts are usually better loaded before the </body>, so they will load after the page elements.

  2. The bottom line (the one with the src="https://...") should be first (before the actual script). It is a dependency of the script and it must load before the script.

  3. What is it that you are trying to do? (asking because of this option in webflow)

Webflow already have smoothscroll for anchors by deafult - by the way. What you trying to get?

In general first start from codepen - than move this codepen to webflow (Easier flow - because on codepen their is live preview and on webflow on each change you should publish the site (Wait X seconds) --> and refresh browser = hard to debug).

Anyway first load the asset - and only than install the plugin.

Fork this and try to solve this (Hard to answer because this is very old plugin without any working example).
https://codepen.io/ezra_siton/pen/JVVjLW