Fullpage.js - Kaydırmayı engelle

Question

fullpage.js'yi kurdum, ancak bir bölüme kaydırma yapabilmenin işlevselliğini ve bir sonraki kaydırmada aynı bölüm içinde yeni öğeler göstermek için belirli koşullar yerine getirilmesini istiyorsanız. Bu sonraki kaydırma sonraki bölüme geçmemelidir.

Geri aramaları kullanma Bir bölümün bu ikinci kaydırmaya ne zaman ihtiyaç duyduğunu belirleyebiliyorum. Dokümantasyondan önce kaydırma işlemini iptal edebildim ve bu yüzden yeni elemanların bir sonraki bölüme gitmeden gösterilmesine izin verdim. Sorun bundan sonra bir sonraki bölüme geçmesine izin veriyor. Kaydırma işlemini durdurmayı başarabilirim, ancak tekrar kaydırma yapamaz ya da herhangi bir bayrak değişebileceğinden ve bir sonraki kaydırmada birden çok kez hareket ettiğinden metin bir sonraki bölüme kayarken görünür.

 //HTML - typical fullpage.js section 

     <div class="section"> 
      <div> 
       <h1>Default Text</h1> 
       <p class="hidden-text">Additonal text to appear on second scroll</p> 
      </div> 
     </div> 
     <div class="section"> 
      <div> 
       <h1>Next Section</h1> 
      </div> 
     </div> 

     //fullpage.js - the callbacks being used 

     afterLoad: function(anchorLink, index){ 
      preventScroll = false; 
      if(this.has(".hidden-text").length){ 
       preventScroll = true; 
      } 
     }, 
     onLeave: function(index, nextIndex, direction){ 
      if (preventScroll && direction == "down") { 
       this.find('.hidden-text').addClass('animate-text'); 
       this.find('.hidden-text').removeClass('hidden-text'); 
       return false; 
      } 
     }, 

Codepen burada bulunabilir: http://codepen.io/anon/pen/oxEexY

Answer 1

Gizli metin gösterilmiştir zaman bilmek mantığı eklemek zorunda. TimeOut veya başka bir şey ekleyin. Ardından, bu olduğunda bayrağı preventScroll işaretini true olarak değiştirin. Ben metin varsayarsak ediyorum Bu durumda

1 saniye (1000 ms) sonra gösterilmiştir:

Ayrıca

Reproduction online

, ben $(this) değil this nasıl kullandığını unutmayın.