Jquery move object from bottom to top

Question

I have this code to move the box on scroll from top to bottom, but i would like to reverse it, instead from top to bottom i would like to move it from bottom to top. Here's my code guys:

<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>

UPDATE CSS:

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

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

this codes moves the box from top to bottom, how to move it from bottom to top? thanks guys for your answers.

I think $('.box').css('top', $(document).scrollTop()) should move the box to the window top(if box is position:absolute in body), can you create jsfiddle? — Andrew
– Andrew, Commented Nov 22, 2013 at 9:32

Mykhailo Zhuk · Accepted Answer · 2013-11-22 10:17:10Z

1

If I understood you correctly, you want to move the box from bottom to top when you're scrolling down. Hope this will help.

$(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/

answered Nov 22, 2013 at 10:17

Mykhailo Zhuk

7776 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

mahega · Accepted Answer · 2013-11-22 09:35:25Z

0

Would be good if you post your css code.

But here is one proposal:

$('.box').css('bottom', wh);

answered Nov 22, 2013 at 9:35

mahega

3,3814 gold badges25 silver badges35 bronze badges

Collectives™ on Stack Overflow

Jquery move object from bottom to top

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related