Scriffy.js Klasse im aktuellen Abschnitt hinzufügen

Ich versuche, mit scrollify.js dem aktuellen Abschnitt auf einer Seite etwas wie 'active' hinzuzufügen.Scriffy.js Klasse im aktuellen Abschnitt hinzufügen

Ich bin in der Lage, den Indexwert, aber nicht die Sektion ID oder Abschnitt Klasse zu bekommen! Wie erhält man die ID oder Klasse des aktuellen Abschnitts?

Hier ist der Beispielcode, den ich versucht habe zu erreichen.

<section id="first" data-section="first" class="scroll-section"> </section> 

before:function(index, sections) { 
    alert(index); 
},

Dieser Rückgabewert. Ich versuche, den Abschnitt ID zuerst zu erhalten.

Vielen Dank im Voraus.

Quelle

2017-07-28 RaJesh RiJo

Anruf $.scrollify.current() es gibt den aktuellen Abschnitt zurück.

Quelle

2017-07-29 11:52:46

<html> 
    <head> 
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
      <script src="jquery.scrollify.js"></script> 
      <style> 
      .sectioncolor { 
      background-color: black; 
      } 
      </style> 
     <script> 
     $(function() { 

      $.scrollify({ 
      section : ".section-class-name", 
      sectionName : "section-name", 
      before:function(index, sections) { 
      var sno = index+1; 
      $(".section-class-name").removeClass("sectioncolor"); 
      $(".section-class-name:nth-child("+sno+")").addClass("sectioncolor"); 
      }, 
      after:function(index, sections) { 
      var sno = index+1; 
      $(".section-class-name").removeClass("sectioncolor"); 
      $(".section-class-name:nth-child("+sno+")").addClass("sectioncolor"); 


      }, 
      }); 
     }); 
     </script> 
    </head> 
    <body> 
     <div class="section-class-name" data-section-name="home" style="height:500px;border:1px solid red;"></div> 
     <div class="section-class-name" data-section-name="about" style="height:500px;border:1px solid black;"></div> 
    </body> 
    </html>

Quelle

2017-07-28 12:37:49

Ich hoffe, dieses Beispiel wird Ihnen helfen –

Scriffy.js Klasse im aktuellen Abschnitt hinzufügen

Antwort

Verwandte Themen