使用scroll var来增加元素的高度?

时间:2012-12-16 07:50:24

标签: jquery css

下面的函数通过获取窗口高度并将其除以窗口高度来计算用户滚动的距离。随着这个百分比的增加,我想增加css'身高' div的数量'箭头'我究竟做错了什么?

$(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
      });  

1 个答案:

答案 0 :(得分:2)

这应该有效 - 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();
  });