Not using es6 or babel or require

[adamjw3]

I'm loading the script in my html

/resources/js/plugins/smooth-scrolling.min.js

In my js file i have

var section = document.querySelector(".js-slider");
var child = document.querySelector(".js-item");

    var smooth = new Smooth({
        preload: false,
        native: false,
        direction: "horizontal",
        section: section,
        divs: child
    });

    smooth.init();

But this doesn't do anything, I can see from you demos and code examples you are using es6. I'm not i'm using old javascript. how do i extend smooth to use the custom.js (as per demos) but not use es6!

i've tried bits like this

var smooth = new Smooth({
preload: false,
native: false,
direction: "horizontal",
section: section,
divs: child,
run: function() {
// do something
}

    });

Thanks

[baptistebriel]

Hi there,

Sorry for the late answer! If you're not using ES6 or extending the base class of Smooth you can still use the basics by loading smooth-scrolling.min.js.

See this demo; there's no additional JavaScript classes, only the required code to initialise it.
Passing a run function to the options will do nothing, as it's not listed in the README.

Passing divs in the options using smooth-scrolling.min.js will do not work either because this snippet has been taken from another demo that has other options.

There's a few other ways to extend a function prototype; have a read here on MDN and on Stack Overflow. If you can implement ES6 + babel, I'd recommend it. ES6 has just simpler ways to do the same thing we do in ES5, like extending a function's prototype.

[adamjw3]

Been looking more at es6 so adding this to my workflow using grunt. Looking at using browserfy with babel transform. What do you use?

I've seen that a lot of people either do one bundle across all pages or attempt to split the bundle into pages. What do you do?

[baptistebriel]

Hey @adamjw3, sorry for replying one year later. 😅
You can have a look at the package.json of this repository, I'm using simple npm scripts. Obviously, you'd rather use grunt/gulp or webpack for bigger projects.