how to scroll to a position in a page by clicking on link

Question

Hi coder i am new to jquery. i serach alot but fail to find this what i am looking is not a customize application, i just want process or method how we can achieve this.

Suppose i have a menu or link like below

Home

About

Contact

As a link or menu and when i click on that any of the link or menu i srcoll down to position of the page where details for it present..

Just like This link where click on the above menu scroll to the position of it on the page

This should be a single page application.

Any idea's or tutorial for this i want to do it jquery.

I can use scrollup(), scroll(), animate() but how to proceed this that is the main concren any help would be appreciated.

possible duplicate of http://stackoverflow.com/questions/3432656/scroll-to-a-div-using-jquery — Amit Soni, Apr 03 '14 at 10:54
Thank let me look at it and if this is want i want then i will let you know my friend thank for the link — Amitesh, Apr 03 '14 at 10:55
possible duplicate of [Simple jQuery scroll to anchor up or down the page...?](http://stackoverflow.com/questions/8579643/simple-jquery-scroll-to-anchor-up-or-down-the-page) — Jon, Apr 03 '14 at 10:55

score 2 · Answer 1 · answered Apr 03 '14 at 10:55

2

Are you by any chance talking about HTML anchors? http://www.echoecho.com/htmllinks08.htm

answered Apr 03 '14 at 10:55

Koby Yehezkel

208
4
11

score 1 · Accepted Answer · answered Apr 03 '14 at 15:11

This is the best link for your solution Single Page Site with Smooth Scrolling, Highlighted Link, and Fixed Navigation

In this link you get how to stick your menu using this

 $(window).scroll(function () {
        var window_top = $(window).scrollTop()+12; // the "12" should equal the margin-top value for nav.stick
        var div_top = $('#nav-anchor').offset().top;
        if (window_top > div_top) {
            $('nav').addClass('stick');
        } else {
            $('nav').removeClass('stick');
        }
    });

use scrollto.js file to scroll through the page and call it in that function for smooth scrolling

 $("nav a").click(function (evn) {
        evn.preventDefault();
        $('html,body').scrollTo(this.hash, this.hash);
    });

I hope this will help you

score 0 · Answer 3 · edited May 23 '17 at 12:28

0

$('html,body').animate({scrollTop: $('#scrollToId').offset().top});

Check this solution jQuery scroll to element

edited May 23 '17 at 12:28

Community

1
1

answered Apr 03 '14 at 10:56

Ammy T

491
3
4

in this button is at the bottom what i want is to to put button at top and then move to element – Amitesh Apr 03 '14 at 13:11

how to scroll to a position in a page by clicking on link

3 Answers3