最新消息:Welcome to the puzzle paradise for programmers! Here, a well-designed puzzle awaits you. From code logic puzzles to algorithmic challenges, each level is closely centered on the programmer's expertise and skills. Whether you're a novice programmer or an experienced tech guru, you'll find your own challenges on this site. In the process of solving puzzles, you can not only exercise your thinking skills, but also deepen your understanding and application of programming knowledge. Come to start this puzzle journey full of wisdom and challenges, with many programmers to compete with each other and show your programming wisdom! Translated with DeepL.com (free version)

javascript - How to scroll to a div id in GWT - Stack Overflow

matteradmin7PV0评论

I have a webpage with an iframe in which a gwt application is running. The webpage has a <div id="head">. It is not possible to scroll in the iframe (intended) so the webpage has for example a height of 1000px. At the very bottom there is a button and I want that when someone clicks on that button (note: the button is in the gwt application) then I want to scroll to the top.

That means that the iframe needs to force the parent window to scroll to the top. I tried it with a jsni function like this:

    public static native void scrollToTop()  /*-{
        $wnd.top.scrollTo(0,0);
    }-*/;

But this didn't work. So my new idea is to scroll to the div id "header". Does anyone know how to acplish this?

I tried it like this:

document.getElementById('header').scrollIntoView();

But that seems not to work (because it should be in a JSNI manner?).

Thanks for any inputs!

I have a webpage with an iframe in which a gwt application is running. The webpage has a <div id="head">. It is not possible to scroll in the iframe (intended) so the webpage has for example a height of 1000px. At the very bottom there is a button and I want that when someone clicks on that button (note: the button is in the gwt application) then I want to scroll to the top.

That means that the iframe needs to force the parent window to scroll to the top. I tried it with a jsni function like this:

    public static native void scrollToTop()  /*-{
        $wnd.top.scrollTo(0,0);
    }-*/;

But this didn't work. So my new idea is to scroll to the div id "header". Does anyone know how to acplish this?

I tried it like this:

document.getElementById('header').scrollIntoView();

But that seems not to work (because it should be in a JSNI manner?).

Thanks for any inputs!

Share Improve this question edited Oct 12, 2011 at 15:33 Hilbrand Bouwkamp 13.5k1 gold badge47 silver badges52 bronze badges asked Oct 12, 2011 at 12:46 mknmkn 13.2k17 gold badges52 silver badges65 bronze badges
Add a ment  | 

2 Answers 2

Reset to default 5

It fails because GWT runs in an iframe, so document references the GWT's iframe, and not your "HTML host page". You have to use $doc in JSNI to reference the document (just like $wnd instead of window).

But you actually don't need JSNI for that; plain old Java/GWT will do:

Document.get().getElementById("header").scrollIntoView();

Finally I found the solution. You have to set an anchor at the top of your website (the website inside the iframe). Please look at my other post for more details.

P.S. I hope you see the importance of this post and upvote it. It will save a lot of time for other people.

Post a comment

comment list (0)

  1. No comments so far