# RJS scroll to DOM object

**URL:** <https://www.ruby-forum.com/t/rjs-scroll-to-dom-object/134584>\
**Category:** Rails\
**Created:** [April 12, 2008, 12:30pm UTC](https://www.ruby-forum.com/t/rjs-scroll-to-dom-object/134584 "2008-04-12T12:30:14Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![chunkyslink](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/f0a364/32.png) [@chunkyslink](https://www.ruby-forum.com/u/chunkyslink)\
**Post date:** [April 12, 2008, 12:30pm UTC](https://www.ruby-forum.com/t/rjs-scroll-to-dom-object/134584/1 "2008-04-12T12:30:14Z")

</div>

Is there an rjs helper for zooming or scrolling to a DOM object, e.g.  
page.view\_object “object”?

I’ve tried using named anchors in combination with link\_to\_function, but  
unless I’m doing something wrong, the onclick seems to override the  
default browser behavior of skipping to a DOM element. For example;

This works;

\<%= link\_to “Nav”, “#header” %\>

But this doesn’t;

\<%= link\_to\_function(“Nav”, :href =\> “#header”) do |page|  
some javascript  
end %\>

It doesn’t seem to matter which rjs helpers I use, or even if I don’t  
use any at all, the onclick seems to kill the skip to the named anchor.  
So I was hoping I could just call an additional rjs helper to avoid the  
problem.

---

<div class="post-metadata">

**Author:** ![chunkyslink](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/f0a364/32.png) [@chunkyslink](https://www.ruby-forum.com/u/chunkyslink)\
**Post date:** [April 12, 2008, 2:29pm UTC](https://www.ruby-forum.com/t/rjs-scroll-to-dom-object/134584/2 "2008-04-12T14:29:28Z")

</div>

On Apr 12, 11:30 am, Neil C. [removed\_email\_address@domain.invalid](mailto:removed_email_address@domain.invalid)  
wrote:

> Is there an rjs helper for zooming or scrolling to a DOM object, e.g.  
> page.view\_object “object”?

page[‘some\_id’].scrollTo() should do the trick. The reason why the  
default behaviour is overriden is that rails generates you something  
that looks like [and the return false prevents the default action.](#header)

[ 

Fred

](#header)

---

<div class="post-metadata">

**Author:** ![chunkyslink](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/f0a364/32.png) [@chunkyslink](https://www.ruby-forum.com/u/chunkyslink)\
**Post date:** [April 12, 2008, 2:36pm UTC](https://www.ruby-forum.com/t/rjs-scroll-to-dom-object/134584/3 "2008-04-12T14:36:24Z")

</div>

Frederick C. wrote:

> On Apr 12, 11:30�am, Neil C. [removed\_email\_address@domain.invalid](mailto:removed_email_address@domain.invalid)  
> wrote:
> 
> > Is there an rjs helper for zooming or scrolling to a DOM object, e.g.  
> > page.view\_object “object”?
> 
> page[‘some\_id’].scrollTo() should do the trick. The reason why the  
> default behaviour is overriden is that rails generates you something  
> that looks like [and the return false prevents the default action.](#header)
> 
> [ 
> 
> Fred
> 
> ](#header)

[ 

That works just fine, thank you. Slightly related; is there an easy way  
to get the cursor to sit inside the page[‘some\_id’]? I’m looking to use  
the same behavior on a textarea, so it would make sense to put the  
cursor inside the textarea.

](#header)

---

<div class="post-metadata">

**Author:** ![chunkyslink](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/f0a364/32.png) [@chunkyslink](https://www.ruby-forum.com/u/chunkyslink)\
**Post date:** [April 12, 2008, 2:45pm UTC](https://www.ruby-forum.com/t/rjs-scroll-to-dom-object/134584/4 "2008-04-12T14:45:17Z")

</div>

The reason the link\_to\_function doesn’t scroll to your named element  
is that it appends a “return false;” after your javascript, which  
stops the default action.

You can use prototype javascript call Element.scrollTo(‘header’).

\<%= link\_to\_function “Nav”, “Element.scrollTo(‘header’)” %\>

On Apr 12, 6:30 am, Neil C. [removed\_email\_address@domain.invalid](mailto:removed_email_address@domain.invalid)