Javascript pop up scroll jump_问答_开发者_运维开发者技术经验分享

开发者 https://www.devze.com 2023-03-24 12:56 出处：网络

Surely there is an 开发者_如何学JAVAeasy way to do this. I need to load a page in a java script popup window. But the content I need to show in the window are a ways down the page. Is there a way to jump to that part of the page? (So jump to a vertical scroll coordinate?) (Also, I cannot edit the page which is being shown. Merely the link to it)

Any help is much appreciated!

The easiest way would be to link to an element on the page by appending its id after a hash in the url. ie, when openinging your popup,

window.open('pagename.html#element-to-show','mywindow','width=400,height=200')

where "element-to-show" is the id of the element that is down the page.

Use HTML anchors and load page.html#myanchor in the popup (instead of just page.html).

http://www.w3.org/TR/html4/struct/links.html

Assuming you can't link to anchors but the page you load into the popup is in the same domain you could use something like this:

load the popup
set the onload event for the popup to scroll after it has been loaded
the popped up page will scroll down after it has been loaded

You may want to customize this, e.g. you could provide an additional parameter to openInPopUp() with the exact position to scroll to.

Here's the The Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
    <head>

        <script language="javascript" type="text/javascript">
          function openInPopUp(link) {
            // (1) load the popup
            newwindow = window.open(link.href, 'name', 'height=300,width=200,resizable=1,scrollbars=1');

            // (2) set the onload event
            newwindow.onload = function() {
                scrollDown();
            };

            return false;
          }

          function scrollDown(){
            // (3) scroll down
            newwindow.scrollTo(0, 200);
          }
        </script>
        <title></title>
    </head>
    <body>
        <p>
            <a href="popup.html" onclick="return openInPopUp(this)">open link to popup and scroll down</a>
            <br/><br/>

            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum<br/>
            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum<br/>

        </p>
    </body>
</html>

If you want to load content from another domain, than the calling page, this won't work but end in a permissions error.

Details for the scrollTo function