Anchor tag, to go to the beginning of a div class w/ USING jQuery

Question

I want to implement a global anchor type of functionality.

I want to include a link to the main part of the web page, globally by inputting into my header.inc file.

When you select the link, it will scroll to the main part of the page, which is within the div class content-body

<div class="content-body">
  main content
</div>

So it will scroll down to where the div begins.

I want to achieve the anchor tag functionality, but it goes to a div class, not id.

I want to know if there is a way to do this with jQuery. Why I want to do this, is because I can globally implement this throughout the entire existing website.

Answer 1

Well, traditionally this is done by using an id attribute on an element and making the anchor point to that id.

<a href="#main">Go to Main Element</a>

<div id="main"></div>

The hash tag is the key as that indicates that you're wanting to direct the user to somewhere within the same document.

This is, of course, assuming that you are not saying that the class attached to the 'main' element in question is your only option.

Answer 2

You could use scrollTop in jQuery. Here is a page that shows this.