Use address to move the content of the webrowser

Question

If I paste the address "www.website.com#adiv" I would like the content of the web browser to move into a specific location that has id=adiv. The content that start with id=adiv should be located on the top of the web browser

Is it possible to do it?

Maybe there's another way to do it?

<table>
    <tr>
        <td height=800>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
        </td>
    </tr>
    <tr>
        <td height=800 id=adiv >    
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br> 
        </td>
    </tr>
    <tr>
        <td height=800 id=adiv >    
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br>
            asdfasdf<br> 
        </td>
    </tr>
</table>

It should do that all by itself, as long as there is a scrollbar and enough content to actually scroll to the element — adeneo, Apr 29 '15 at 20:32
Check out this question/answer: http://stackoverflow.com/questions/3163615/how-to-scroll-html-page-to-given-anchor-using-jquery-or-javascript — MannfromReno, Apr 29 '15 at 20:33
Are you talking about scrolling or actually moving the content from one location to another. Please clarify and reword your question if you are asking about scrolling. — mcphersonjr, Apr 29 '15 at 20:36
Note that it can't always move a DIV to the top of the browser window. There has to be enough content below the DIV to reach the bottom of the window. So it will scroll as far as it can and then stop. — Barmar, Apr 29 '15 at 20:37
This code works for me in fiddle... after changing the src on the result panel with dev tool — Huangism, Apr 29 '15 at 20:51

freethinker · Answer 1 · 2015-04-29T21:14:54.133

You can get current url by window.location.href , get this id from url and scroll to element position.

Pure javascript:

window.addEventListener('load', scrollToElement, false );    

function scrollToElement(){
    var href = window.location.href;
    var id = href.split('#')[1];

    var element = document.getElementById("#" + id);
    if(element){
       var offsetTop = element.offsetTop;
       window.scrollTo(offsetTop, 0);
    }
}

And jquery version:

$(document).ready(function(){
    var href = window.location.href;
    var id = href.split('#')[1];

    var element = $("#" + id);
    if(element){
        var offsetTop = element.offset().top;
        $('html, body').animate({
               scrollTop: offsetTop
         }, 2000);
    } 
})

Use address to move the content of the webrowser

1 Answers1