Is it possible to apply the same scroller to many identical elements that are in a row

Hi <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="

Applying one scroller to all instances of same element about ftscroller HOT 3 CLOSED

ptsimpso commented on July 2, 2024

Applying one scroller to all instances of same element

from ftscroller.

Comments (3)

matthew-andrews commented on July 2, 2024

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;
}