向下滚动时减小Div宽度，并在通过Jquery

Question

当我向下滚动时，我希望减小div宽度，但是当用户滚动到顶部时我想将其恢复。 （顶部为，150或更少）。

我尝试了下面的代码，当我向下滚动时可以正常工作但滚动到顶部时不起作用。

我不确定我错过了什么。

 $(document).scroll(function() { 

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


            if (scrollPosition <= 150) {

                $("div.mydiv").animate({
                    width : "20%"
                });
            }
            else {
                $("div.mydiv").animate({
                    width : "50px"
                });
            }

    });

知道我缺少什么吗？

由于

Answer 1

试试这个：

＆＃13;

＆＃13;

$(window).scroll(function() { 
	var scrollPosition = $(this).scrollTop();
	if (scrollPosition <= 150) {
		if($("div.mydiv").is(":animated")){
		}else{
			$("div.mydiv").animate({
				width : "20%"
			},100);
		}
	} else {
		if($("div.mydiv").is(":animated")){
		}else{
		$("div.mydiv").animate({
			width : "50px"
			},100);
		}
	}
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="mydiv" style="width:20%;height:1500px;border:1px solid black">DIV TEST</div>

＆＃13;

＆＃13;

＆＃13;