javascript - jquery 将对象从底部移动到顶部

Question

我有这段代码可以将滚动条上的框从上到下移动，但我想反转它，而不是从上到下，我想将它从下到上移动。这是我的代码伙计们:

<script type="text/javascript">
            $(document).ready(function() {
                $(window).scroll(function() {
                    var x = $(document).scrollTop();
                    var wh = $(window).height();
                    console.log($(document).scrollTop());
                    $('.box').css('top', x);
                });
            });
</script>

更新 CSS:

body {
                background-image:url('bg.jpg');
                height: 20000px;
            }

            div {
                width: 50px;
                height: 50px;
                background: #f00;
                top: 0%;
                position: fixed;
            }

这段代码将盒子从上到下移动，如何将它从下到上移动？谢谢你们的回答。

Answer 1

如果我没理解错的话，您想要在向下滚动时将框从底部移动到顶部。希望这会有所帮助。

$(window).scroll(function() {
    var x = $(document).scrollTop();
    var dh = $(document).innerHeight();
    var offset = x/dh*100+'%';
    $('.box').css('bottom', offset);
});

http://jsfiddle.net/avDMJ/13/