alvarotrigo / pagePiling.js

pagePiling plugin by Alvaro Trigo. Create a scrolling pile of sections. http://alvarotrigo.com/pagePiling/
4.1k stars 653 forks source link

Multiple instances #231

Closed tmatiev-inostudio closed 2 years ago

tmatiev-inostudio commented 2 years ago

Hello, alvarotrigo! Can you add support multiple instances on the same page? I have 2 different forms on the same which use pagepiling.js to switch between form steps, but in the current it is not working correctly.

For example:

$("#first-form").pagepiling({
    easing: "linear",
    scrollingSpeed: 300,
    sectionSelector: ".first-form-section",
    afterLoad: function (anchor, index){
      currentSectionIndex = index;
    },
  });

<div id="first-form">
  <div class="first-form-section" data-anchor="ff-section-0"></div>
  <div class="first-form-section" data-anchor="ff-section-1"></div>
  <div class="first-form-section" data-anchor="ff-section-2"></div>
</div>
$("#second-form").pagepiling({
    easing: "linear",
    scrollingSpeed: 300,
    sectionSelector: ".second-form-section",
    afterLoad: function (anchor, index){
      currentSectionIndex = index;
    },
  });

<div id="second-form">
  <div class="second-form-section" data-anchor="sf-section-0"></div>
  <div class="second-form-section" data-anchor="sf-section-1"></div>
  <div class="second-form-section" data-anchor="sf-section-2"></div>
</div>
alvarotrigo commented 2 years ago

Can you add support multiple instances on the same page?

Unfortunately not.