How to scroll page to element

4,427 views
Skip to first unread message

redlaber

unread,
Apr 12, 2010, 8:34:59 AM4/12/10
to Google Web Toolkit
I want to scroll page, generated with gwt, to some element. Its should
be simple, but i cannt find the solution. For example: I have a
vertical panel with two flexables. When i get the history token
"goto2" I want to scroll my page to the second table. (Sorry for the
terrible english).

t.dave

unread,
Apr 12, 2010, 12:12:41 PM4/12/10
to Google Web Toolkit
use ScrollPanel.setScrollPosition(). that sets the vertical scroll
position of the scrollpanel, which you will need to calculate. try
something like this:

new ClickHandler() {
public void onClick( ClickEvent event ) {
int tableTop = secondFlexTable.getAbsoluteTop();
scrollPanel.setScrollPosition( tableTop );
}
}

i suppose in your case it wouldn't be a click handler if you're basing
it off the history token, but hopefully this will point you in the
right direction.

redlaber

unread,
Apr 13, 2010, 1:49:54 AM4/13/10
to Google Web Toolkit
So i must plaсe my VerticalPanel onto ScrollPanel?

redlaber

unread,
Apr 13, 2010, 2:55:27 AM4/13/10
to Google Web Toolkit
The next problem: I have finished big gwt-application and I cant add a
ScrollPanel in it. But i know position of browser scrollbar, where I
want to jump (scroll). Is there no way to simply scroll through the
document to a given position?

On 12 апр, 19:12, "t.dave" <da...@lorgeousdays.com> wrote:

mram

unread,
Apr 13, 2010, 4:35:21 AM4/13/10
to Google Web Toolkit
I don't understand well your question, but why don't you use div to
separate parts from the page, and then call the div class that you
need??

Jason Morris

unread,
Apr 13, 2010, 4:41:40 AM4/13/10
to google-we...@googlegroups.com
I assume you're using GWT 2.0. If so dom.client.Element has a method:
"scrollIntoView" which may be what you are looking for.

To scroll to a Button for example:

Button button = new Button();
//...

button.getElement().scrollIntoView();

This will scroll any required elements (including ScrollPanels and the
document itself) to make sure that the Button is visible to the user.

Hope that helps.
//Jason

redlaber

unread,
Apr 13, 2010, 9:37:27 AM4/13/10
to Google Web Toolkit
This is exactly what I was looking for. Thanks much, Jason! I'll try
it tomorrow and write here the result.

Brandon Turner

unread,
Apr 12, 2010, 12:19:16 PM4/12/10
to google-we...@googlegroups.com
You can get away without a ScrollPanel if you want to as well.  Something like:

verticalPanel.getElement().setScrollTop(secondFlexTable.getElement().getAbsoluteTop());

-Brandon


--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To post to this group, send email to google-we...@googlegroups.com.
To unsubscribe from this group, send email to google-web-tool...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.


t.dave

unread,
Apr 13, 2010, 4:52:48 PM4/13/10
to Google Web Toolkit
I've learned some things reading this thread. nice. :)

looks like there are some easier ways of doing things than how i'm
doing my scrolling, and this would probably be not the easiest, but
i'll mention it for completeness. it's also possible to do the
browser window scrolling in javascript, and make a JSNI call to the
javascript function to do it. i'm currently using this method to
simulate a page refresh:

function scrollToTop() {
window.scroll( 0, 0 );
}

and the corresponding GWT JSNI method:

public native void jsScrollWindowToTop() /*-{
$wnd.scrollToTop();
}-*/;

just one more option.

> > google-web-tool...@googlegroups.com<google-web-toolkit%2Bunsu...@googlegroups.com>

Reply all
Reply to author
Forward
0 new messages