How to scroll programmatically to a position in a page to display desired content (as opposed to display the top of the page)

How to scroll programmatically to a position in a page to display desired content (as opposed to display the top of the page)

I see on some website (like StackOverflow, yahoo, the US Homeland Security department, ...) a word associated to a link that, when clicked, not only loads a page, but also, displays that page at the exact location where the contain related to the word starts.

How can I obtain that with ASP.NET MVC? (by the way, do I need javascript for that?)

Thanks for helping

Answer by Donut for How to scroll programmatically to a position in a page to display desired content (as opposed to display the top of the page)

You need to create a named anchor within the page. This will have the result you're talking about, almost like creating a "bookmark" within a page. No javascript required.

First, create the anchor using the tag with the name attribute specified (in this case, section1):

Then, to link to that anchor from the same page, just use something like this:

Go to Section 1  

If you're linking to that anchor from another page (in this case, mypage.html), append #section1 at the end of the url:

Go to Section 1 in MyPage.html  

For more information, see here.

Answer by Diodeus for How to scroll programmatically to a position in a page to display desired content (as opposed to display the top of the page)

1) Find the coordinates of the element on the page

2) window.scrollTo(x,y)

Answer by Daniel A. White for How to scroll programmatically to a position in a page to display desired content (as opposed to display the top of the page)

Its called an anchor tag.

Place this in your HTML.

If you call this URL, it will jump to that place.

html-file.html#name  

See: http://www.w3schools.com/tags/tag_a.asp

Answer by Reese Moore for How to scroll programmatically to a position in a page to display desired content (as opposed to display the top of the page)

You can use a named anchor to do this with HTML, without javascript. here is a link explaining this.

Answer by Nelson Rothermel for How to scroll programmatically to a position in a page to display desired content (as opposed to display the top of the page)

Go to the other content  Some content  

Also the URL can have /yourpage.html#jumpHere or with variables, /yourpage.html?var1=foo&var2=bar#jumpHere.

Since we're talking about the hash (#), it's usually used for jumping to a specific part of the page. Because of that, it won't reload the whole page. This is useful for web applications that move from one view to another using only AJAX. To make each view bookmarkable, JavaScript "saves" the state (what view you are on) using location.hash to the URL. The next time you open the URL, JavaScript reads it and loads the correct view. In HTML5 this is superseded by pushState.

Answer by allupaku for How to scroll programmatically to a position in a page to display desired content (as opposed to display the top of the page)

It is very simply done with id tag of differnt html elements for eg :- an div element if it is having "footer" as its id and is placed at the bottom of the page then, http://url-address-to-thatpage.html#footer will load the page and scroll it too the footer. (adding the "#idoftheelement" after the page url) It is also possible to load and scroll the page with javascript.

Answer by Chris Ellingsworth for How to scroll programmatically to a position in a page to display desired content (as opposed to display the top of the page)

Another way to do it is with the "id" attribute if it's not an anchor tag you'd like to bookmark. For example:

Content...
  

Then, you can link to it with an anchor tag like this:

Go to content  

Or link to that spot on the page by appending a #bookmark1 to

http://yourwebsite.com/page#bookmark1  

Fatal error: Call to a member function getElementsByTagName() on a non-object in D:\XAMPP INSTALLASTION\xampp\htdocs\endunpratama9i\www-stackoverflow-info-proses.php on line 72