AJAX effects make browser jump to top of page

I’ve been having this really annoying issue with any visual effect that
I use in Rails. Say, for instance, that I have an Element.show or
Element.hide link to expose a hidden div. Well, the effects work great,
but if they are located far enough down on the page to necessitate
scrolling, the effect makes the browser jump to the top of the page.

This is basically the source output that is produced:

switch

stuff goes here

Anyone run into this, know the cause and know how to stop it?

It’s the href="#" that’s making the page jump like that. You should put
the onClick on a div or a span (anything but an anchor tag), and have
some CSS to set a hover: icon change to simulate a link.

Jason

You can also try “Effect.toggle(‘whatever’); return false;” which
instructs the browser to cancel the navigation.

james payne wrote:

You can also try “Effect.toggle(‘whatever’); return false;” which
instructs the browser to cancel the navigation.

YES! Thank you. I actually just peaked at the 37 signals code and
noticed they were doing that very thing.

Jason R. wrote:

It’s the href="#" that’s making the page jump like that. You should put
the onClick on a div or a span (anything but an anchor tag), and have
some CSS to set a hover: icon change to simulate a link.

Thanks for the tip Jason. Yeah, I’ve been avoiding that since I’ve seen
others get this working (not to mention it negates the whole
link_to_remote method). The “return false;” did the trick.

This forum is not affiliated to the Ruby language, Ruby on Rails framework, nor any Ruby applications discussed here.

| Privacy Policy | Terms of Service | Remote Ruby Jobs