Applying one scroller to all instances of same element

[ptsimpso]

Is it possible to apply the same scroller to many identical elements that are in a row? I'd like to do something like this:

var nestedScroller = new FTScroller(document.querySelector('.eventWrap'), {
scrollbars: true,
scrollingX: false,
scrollingY: true,
updateOnWindowResize: true
});

However, this only adds an FTScroller to the first element with the class "eventWrap" that it finds.

[matthew-andrews]

Hi @ptsimpso, thanks for your suggestion. The logic you're requesting is actually quite light, eg:

var nestedScroller = [];
var scrollingEls = document.querySelectorAll('.eventWrap');
for (var i = 0, l = scrollingEls.length; i < l; i++) {
  nestedScroller.push(new FTScroller(scrollingEls[i], {
    scrollbars: true,
    scrollingX: false,
    scrollingY: true,
    updateOnWindowResize: true
  }));
}

@rowanbeentje, am I right in thinking this is probably something that we won't bake into FTScroller?

If there is a need to use this kind of logic often, I think we would probably recommend that you simply implement a convenient method in your application that applies your standard FTScroller options to elements matching a given selector. For example:

function applyMyScroller(selector) {
  var ftScrollers = [];
  var scrollingEls = document.querySelectorAll(selector);
  for (var i = 0, l = scrollingEls.length; i < l; i++) {
    ftScrollers.push(new FTScroller(scrollingEls[i], {
      scrollbars: true,
      scrollingX: false,
      scrollingY: true,
      updateOnWindowResize: true
    }));
  }
  return ftScrollers;
}

[ptsimpso]

That works perfectly. Thanks so much for the help!

[matthew-andrews]

You're welcome. Closing this issue.