How to use scrollTop in jQuery when scrolling within a div?

Question

enter image description here The left is the what I'm trying to scroll...it scrolls just a little bit and then stops. It seems to scroll the same amount each time too.

I am trying to get the scrollTop using jQuery to work on page load when the content I am trying to scroll to is located in within a div. The current implementation doesn't do anything

javascript

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>

<script>
    $(document).ready(function (){
            //$(this).animate(function(){
                $('html, body').animate({
                    scrollTop: $("#test4").offset().top
                     }, 2000);
            //});
    });
</script>

html

<div class="row">
    <div class = "span12">
    
        <div class = "row">
        
            <div class = "span2">
            
                <div style="height:480px;font:12px Georgia, Garamond, Serif;overflow:auto;">
                
                    <div id = "test1">Test1</div>
                    <div id = "test2">Test2</div>
                    <div id = "test3">Test3</div>
                    <div id = "test4">Test4</div>
                
                </div>
            </div>
        
        
            <div class = "row">
                <div class = "span8">
                    Other content on the page
                </div>
            </div>
        
        </div>
    </div>
</div>

It works here: jsfiddle.net/FYHXC . Are you sure your page has vertical scrolling because it's too big for the window? — Ian
– Ian, Commented Nov 1, 2012 at 5:04
@PulkitMittal that seems to be the same as what I have, but it doesn't seem to work. It scroll just a little bit (the same amount) each time and then stops. — sharataka
– sharataka, Commented Nov 1, 2012 at 6:07

Jai · Accepted Answer · 2012-11-01 08:16:51Z

7

I have changed your code little bit you can find the fiddle here.

this is the js code i have used:

$('.sss').animate({
    scrollTop: $(".test5").offset().top
}, 2000);

here

$('.sss')

is the holder which holds the sidelinks

answered Nov 1, 2012 at 8:16

Jai

74.8k12 gold badges77 silver badges104 bronze badges

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

Collectives™ on Stack Overflow

How to use scrollTop in jQuery when scrolling within a div?

javascript

html

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

javascript

html

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related