# Changing the scroll position programmatically

**URL:** <https://forum.kirupa.com/t/changing-the-scroll-position-programmatically/262925>\
**Category:** web dev\
**Created:** [June 11, 2008, 6:13am UTC](https://forum.kirupa.com/t/changing-the-scroll-position-programmatically/262925 "2008-06-11T06:13:49Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![cold\_wolf](https://avatars.discourse-cdn.com/v4/letter/c/a5b964/32.png) [@cold\_wolf](https://forum.kirupa.com/u/cold_wolf)\
**Post date:** [June 11, 2008, 6:13am UTC](https://forum.kirupa.com/t/changing-the-scroll-position-programmatically/262925/1 "2008-06-11T06:13:49Z")

</div>

Is there a way to change scrollTop(), or any way to scroll the document at all? I don’t want to scroll to where a certain element is, but rather just increment the scroll value.

Thanks in advance.

---

<div class="post-metadata">

**Author:** ![borrob](https://avatars.discourse-cdn.com/v4/letter/b/a87d85/32.png) [@borrob](https://forum.kirupa.com/u/borrob)\
**Post date:** [June 11, 2008, 6:33am UTC](https://forum.kirupa.com/t/changing-the-scroll-position-programmatically/262925/2 "2008-06-11T06:33:11Z")

</div>

scroll down:

document.getElementById( ‘scroll\_container’).scrollTop = document.getElementById( ‘scroll\_container’).scrollTop + 100;

---

<div class="post-metadata">

**Author:** ![cold\_wolf](https://avatars.discourse-cdn.com/v4/letter/c/a5b964/32.png) [@cold\_wolf](https://forum.kirupa.com/u/cold_wolf)\
**Post date:** [June 11, 2008, 7:16am UTC](https://forum.kirupa.com/t/changing-the-scroll-position-programmatically/262925/3 "2008-06-11T07:16:36Z")

</div>

Thanks for replying.

I’ve already tried that and it turns out scrollTop is read-only. I’ve found a jQuery plugin called [ScrollTo](http://plugins.jquery.com/project/ScrollTo) that should work.

Cheers.

---

<div class="post-metadata">

**Author:** ![borrob](https://avatars.discourse-cdn.com/v4/letter/b/a87d85/32.png) [@borrob](https://forum.kirupa.com/u/borrob)\
**Post date:** [June 11, 2008, 7:20am UTC](https://forum.kirupa.com/t/changing-the-scroll-position-programmatically/262925/4 "2008-06-11T07:20:58Z")

</div>

I use this myself and it works fine.  
the scrollto scrolls an element into view, you said you didn’t want that…

---

<div class="post-metadata">

**Author:** ![cold\_wolf](https://avatars.discourse-cdn.com/v4/letter/c/a5b964/32.png) [@cold\_wolf](https://forum.kirupa.com/u/cold_wolf)\
**Post date:** [June 11, 2008, 9:05pm UTC](https://forum.kirupa.com/t/changing-the-scroll-position-programmatically/262925/5 "2008-06-11T21:05:01Z")

</div>

Could you please put it into better context? It doesn’t work for me at all. Using jQuery I’ve tried this:

```auto
$(document).ready(function() {
  console.log(document.getElementById('container').scrollTop);
  document.getElementById('container').scrollTop = document.getElementById('container').scrollTop + 100;
  console.log(document.getElementById('container').scrollTop);
});

```

It simply returns 0 and 0 again after the supposed scroll down. “container” is the main div and the html is full of dummy text to get scrollbars. The CSS looks like this:

```auto
display: block;
margin-left: auto;
margin-right: auto;
width: 50%;

```

Correct, I don’t want to scroll to an element, but ScrollTo has the option to scroll to absolute positions such as 512px and such. I’d like to avoid using a plugin, but I don’t see any other way (I’m using jQuery for other reasons though).