Question

我遇到滚动事件移动元素位置的问题。问题：我正在向上滚动页面并将1px附加到css顶部值（每个滚动）。在此之后我将页面向下滚动，并从css顶部值中删除1px。我认为它会恢复原来的位置，但不是。这是我的代码：

var lastScroll = $(window).scrollTop();

$(window).scroll(function(env) {

 var scroll = $(this).scrollTop();

 if (scroll > lastScroll){
    console.log('Scroll down');
    $('#home>article').css({ 
      top: "+="+1+"px"
    });                                                 
 } else {
   console.log('Scroll up');
   $('#home>article').css({
      top: "-="+1+"px"
 });

lastScroll = scroll;

});

谢谢你的想法！

Answer 1

希望这可能有所帮助，这是我刚才用过的东西。我一直在使用：

<script type="text/javascript">// <![CDATA[
$(window).scroll(function () {
            var ttop = $('.container').position().top;
            var hcltb = $('.container').height();
            var mtop = $(window).scrollTop();
            if (mtop > ttop) {
                if (mtop < (ttop + hcltb - 400)) {
                    $('.internal_prev').css('top', (mtop - ttop + 300));
                    $('.internal_next').css('top', (mtop - ttop + 300));
                    $('.internal_commands').css('top', (mtop - ttop + 300));
                }
            }
        });
// ]]></script>

这会导致div class =＆＃34; container＆＃34;充当主要容器。然后它将使internal_ *类在div内部向上和向下滚动，并设置内部填充为400.

这不完美但是你走了。

Answer 2

当滚动事件触发时，对于每个滚动的像素，不保证触发一次。滚动10个像素一次然后滚动2个像素后，它可能会触发。您必须跟踪上次调用处理程序的scrollTop增量（更改）。

元素移动由Jquery滚动

2 个答案: