2016-03-24 19 views
-1

Kullanıcının ne zaman kaymayı durdurduğunu temel olarak algılayan bir bileşen yapıyorum. Ardından, sayfadaki kapanır bölüm etiketini bulur ve bölümün en üstüne kaydırır. Chrome ve Safari'de% 95 işim bitti ve mükemmel çalışıyor, ancak hayatımın Firefox'ta düzgün çalışmasını sağlayamam. Sorunum, Firefox'un body etiketinin scrollTop değerini bulamamasıdır. Her zaman ne dediği önemli değil 0 ya da 1. Bu sayıyı okurken belgeyi de içeren pek çok düzeltmeyi görüyorum. Vücudundan önce, ama bu sadece benim betiğimde hatalara neden oluyor. PageOffsetY ve jQuery gibi diğer yöntemleri kullanmaya çalıştığımda hala kodumla ilgili sorunlar yaşıyorum. Bu sorunu çözmek için herhangi bir öneriniz varsa, bu harika olurdu. Ayrıca aşağıda aşağıda vereceğim bu düzeltmeyi sağlamak için düzgün kaydırma işlevimi değiştirmeye de açıkım. Ancak tek şey, kullanıcı tekrar kaymaya başlarsa fonksiyonu iptal edebilmem gerekiyor ve bu, fonksiyon çalışırken kaydırma yapmayı denediğinde kullanıcıyla mücadele etmeyen tek javascript.element.scroll Firefox'ta çalışmaz

smooth_scroll_to(document.body, scrollPoint.y, 600); 


var smooth_scroll_to = function(element, target, duration) { 
    target = Math.round(target); 
    duration = Math.round(duration); 
    if (duration < 0) { 
     return Promise.reject("bad duration"); 
    } 
    if (duration === 0) { 
     element.scrollTop = target; 
     return Promise.resolve(); 
    } 

    var start_time = Date.now(); 
    var end_time = start_time + duration; 

    var start_top = element.scrollTop; 
    var distance = target - start_top; 

    // based on http://en.wikipedia.org/wiki/Smoothstep 
    var smooth_step = function(start, end, point) { 
     if(point <= start) { return 0; } 
     if(point >= end) { return 1; } 
     var x = (point - start)/(end - start); // interpolation 
     return x*x*(3 - 2*x); 
    } 

    return new Promise(function(resolve, reject) { 
     // This is to keep track of where the element's scrollTop is 
     // supposed to be, based on what we're doing 
     var previous_top = element.scrollTop; 

     // This is like a think function from a game loop 
     var scroll_frame = function() { 
      if(element.scrollTop != previous_top) { 
       reject("interrupted"); 
       return; 
      } 

      // set the scrollTop for this frame 
      var now = Date.now(); 
      var point = smooth_step(start_time, end_time, now); 
      var frameTop = Math.round(start_top + (distance * point)); 
      element.scrollTop = frameTop; 

      // check if we're done! 
      if(now >= end_time) { 
       resolve(); 
       return; 
      } 

      // If we were supposed to scroll but didn't, then we 
      // probably hit the limit, so consider it done; not 
      // interrupted. 
      if(element.scrollTop === previous_top 
       && element.scrollTop !== frameTop) { 
       resolve(); 
       return; 
      } 
      previous_top = element.scrollTop; 

      // schedule next frame for execution 
      setTimeout(scroll_frame, 0); 
     } 

     // boostrap the animation process 
     setTimeout(scroll_frame, 0); 
    }); 
} 
+0

Bir keman gönderebilir miyim? –

cevap

0

Kullanım document.documentElement yerine document.body:

smooth_scroll_to(document.documentElement, scrollPoint.y, 600); 
+0

Bu soruya cevap verdin mi? Bir yorum bırakabilir misiniz? – trincot