요소의 높이를 높이려면 스크롤 막대를 사용하십시오.

Question

아래 기능은 창 높이를 창 높이로 나눔으로써 사용자가 스크롤 한 거리를 계산합니다. 그 백분율이 증가함에 따라 div의 '화살표'크기의 CSS '높이'를 늘리고 싶습니다. 내가 도대체 ​​뭘 잘못하고있는 겁니까?

$(document).scroll(function(){ 

     // grab the scroll amount and the window height 
      var scrollAmount = $(window).scrollTop(); 
      var documentHeight = $(document).height(); 

     // calculate the percentage the user has scrolled down the page 
      var scrollPercent = (scrollAmount/documentHeight) * 100; 



      function increaseHeight() { 
       $(".arrow").css({ 
        height: scrollPercent + 'px' 
       }); 

       //do something when a user gets 50% of the way down my page 
     }); 

Answer 1

이 작동합니다 - http://jsfiddle.net/LsuY4/1/

$(document).scroll(function(){ 
     // grab the scroll amount and the window height 
      var scrollAmount = $(window).scrollTop(); 
      var documentHeight = $(document).height(); 

      // calculate the percentage the user has scrolled down the page 
      var scrollPercent = (scrollAmount/documentHeight) * 100; 

      $(".arrow").css({ 
      height: scrollPercent + 'px' 
      }); 

      // do something when a user gets 50% of the way down my page 
     }); 

을 또는 (난 당신이 여기에 뭘 하려는지 확실하지 않다) :

$(document).scroll(function(){ 
    // grab the scroll amount and the window height 
     var scrollAmount = $(window).scrollTop(); 
     var documentHeight = $(document).height(); 

     // calculate the percentage the user has scrolled down the page 
     var scrollPercent = (scrollAmount/documentHeight) * 100; 

     var fnDoScroll = function() { 
     $(".arrow").css({ 
      height: scrollPercent + 'px' 
     }); 
     }; 

     // do something when a user gets 50% of the way down my page 
     if (scrollPercent >= 50) 
     fnDoScroll(); 
    });